json2view


Source link: https://github.com/Avocarrot/json2view

json2view

json2view is a simple library that can convert a compatible JSON file to an Android view so you can load dynamically the view in your Android app without the need to update the APK.

This removes the hassle of updating, re-compiling and uploading the APK to Google Play everytime you want to make small or big changes in the UI.

Common use cases

  1. If you need to A/B test different UI designs without the need to re-upload your APK.
  2. If your app's UI changes dynamically based on different users or scenarios.
  3. If you need to deploy UI fixes quickly and in real-time.

In the case of Avocarrot, we are using json2view to run A/B test experiments and quickly deploy UI enhancements that improve revenue performance of native ads integrations in our network.

How it works

You can parse any xml through the json2view library to create a JSON that will be used at runtime to dynamically generate the Android UI using native code. This JSON can be hosted anywhere on the internet (your own server, Dropbox, Github Pages etc.) and can be fetched in your app at any point you decide.

Note: Runtime creation of a view without the precompiled version of xml in apk (res/layout), especially for highly complex layouts, can be a potential latency issue.

Examples

Changing text color

Using json2view to change text color, background color and position of a view. (more details)

Reorganizing the layout

Using json2view to reorganize the layout of a screen. (more details)

You can find more help and examples in the wiki.

Also, a sample project for quick use of the lib can be found in the sample submodule

Installation

  • Download project
git clone https://github.com/Avocarrot/json2view.git 
  • add json2view in your project by adding in your settings.gradle
include ':json2view' project(':json2view'*).projectDir = new File(settingsDir, '$(json2viewPath)/json2view/json2view') 
  • add in build.gradle of application module (not project build.gradle) in dependencies section
compile project(':json2view') 

Getting started

Basic JSON format

The input JSON has 3 fields for every view we want to create :

  • widget : canonicalName of View (for views in package android.widget you can ommit android.widget)
  • properties : list of properties for the view. ( Available Properties) By default we add layout_width & layout_height with value `wrap_content'
  • views : children views for ViewGroup (optional)

eg. JSON to create a empty TextView

{

  "widget": "android.widgetTextView",  "properties": [] 
}

eg. JSON to create a TextView with textSize : 12sp and text : "Hello Avocarrot!"

{

  "widget": "TextView",  "properties": [

{
"name":"textSize", "type": "dimen", "value":"13sp"
}
,

{
"name":"text", "type": "string", "value":"Hello Avocarrot!"
}
  ] 
}

You can find some examples for xml to JSON conversions in the wiki here

You can use ConvertXML2JSON.groovy (from ./utils) to convert any android xml to json2view valid JSON file (the script needs further development to create a valid JSON for every case)
try :

./gradlew runScript -Pxml=./pathToInputXmlFile.xml 

from the root folder of the project

Loading dynamic layout

create and attach view in the specific Parent (created from xml)

ViewParent viewParent = (ViewParent) findViewById(R.id.parent_view_id) JSONObject jsonObject = ... // load from network, sdcard etc View sampleView = DynamicView.createView(this, jsonObject, viewParent);

You can check some example use cases in the wiki here

Contributing

  1. Fork the repo
  2. Apply your changes
  3. Write tests
  4. Submit your pull request

For feedback or suggestions you can drop us a line at [email protected]

License

The MIT License (MIT)

Also check out the project at

Resources

Pretty component to show score points with animation.

You can use Marray instead of ArrayList (map, filter, join and etc.)

Amaze UI is a modular mobile-first front-end framework.

The JumpingBeans make your test jump to the eye. Literally!

The CreditsRoll library allows you to have Star Wars-like credits rolls in your app.

A TextView that blinks, just like the good old HTML <blink> tag.

Topics


2D Engines   3D Engines   9-Patch   Action Bars   Activities   ADB   Advertisements   Analytics   Animations   ANR   AOP   API   APK   APT   Architecture   Audio   Autocomplete   Background Processing   Backward Compatibility   Badges   Bar Codes   Benchmarking   Bitmaps   Bluetooth   Blur Effects   Bread Crumbs   BRMS   Browser Extensions   Build Systems   Bundles   Buttons   Caching   Camera   Canvas   Cards   Carousels   Changelog   Checkboxes   Cloud Storages   Color Analysis   Color Pickers   Colors   Comet/Push   Compass Sensors   Conferences   Content Providers   Continuous Integration   Crash Reports   Credit Cards   Credits   CSV   Curl/Flip   Data Binding   Data Generators   Data Structures   Database   Database Browsers   Date &   Debugging   Decompilers   Deep Links   Dependency Injections   Design   Design Patterns   Dex   Dialogs   Distributed Computing   Distribution Platforms   Download Managers   Drawables   Emoji   Emulators   EPUB   Equalizers &   Event Buses   Exception Handling   Face Recognition   Feedback &   File System   File/Directory   Fingerprint   Floating Action   Fonts   Forms   Fragments   FRP   FSM   Functional Programming   Gamepads   Games   Geocaching   Gestures   GIF   Glow Pad   Gradle Plugins   Graphics   Grid Views   Highlighting   HTML   HTTP Mocking   Icons   IDE   IDE Plugins   Image Croppers   Image Loaders   Image Pickers   Image Processing   Image Views   Instrumentation   Intents   Job Schedulers   JSON   Keyboard   Kotlin   Layouts   Library Demos   List View   List Views   Localization   Location   Lock Patterns   Logcat   Logging   Mails   Maps   Markdown   Mathematics   Maven Plugins   MBaaS   Media   Menus   Messaging   MIME   Mobile Web   Native Image   Navigation   NDK   Networking   NFC   NoSQL   Number Pickers   OAuth   Object Mocking   OCR Engines   OpenGL   ORM   Other Pickers   Parallax List   Parcelables   Particle Systems   Password Inputs   PDF   Permissions   Physics Engines   Platforms   Plugin Frameworks   Preferences   Progress Indicators   ProGuard   Properties   Protocol Buffer   Pull To   Purchases   Push/Pull   QR Codes   Quick Return   Radio Buttons   Range Bars   Ratings   Recycler Views   Resources   REST   Ripple Effects   RSS   Screenshots   Scripting   Scroll Views   SDK   Search Inputs   Security   Sensors   Services   Showcase Views   Signatures   Sliding Panels   Snackbars   SOAP   Social Networks   Spannable   Spinners   Splash Screens   SSH   Static Analysis   Status Bars   Styling   SVG   System   Tags   Task Managers   TDD &   Template Engines   Testing   Testing Tools   Text Formatting   Text Views   Text Watchers   Text-to   Toasts   Toolkits For   Tools   Tooltips   Trainings   TV   Twitter   Updaters   USB   User Stories   Utils   Validation   Video   View Adapters   View Pagers   Views   Watch Face   Wearable Data   Wearables   Weather   Web Tools   Web Views   WebRTC   WebSockets   Wheel Widgets   Wi-Fi   Widgets   Windows   Wizards   XML   XMPP   YAML   ZIP Codes