Make dynamic Android View using json2view library

0
268
How to Make dynamic Android View using json2view library
How to Make dynamic Android View using json2view library

In most of Android application we need to make dynamic Android view as per requirement that’s why i come with json2view library which 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 every-time you want to make small or big changes in the UI.

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.

Updating native android UI
Updating native android UI

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.

Installation

  • Download project
  • 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 TellMeHow!”

{
    "widget": "TextView",
  "properties": [
      {"name":"textSize", "type": "dimen", "value":"13sp"},
      {"name":"text", "type": "string", "value":"Hello TellMeHow!"}
  ]
}

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);

See Example

Xml 2 JSON Examples

Check some examples on how to convert android xml into valid json2view json files

Creating Dynamic Layouts

Here are some examples of how to load the json into a view

Available Properties an Types

In this section you can find which attributes of android views are available and how to load any type of property and types are compatible with the above properties

Share your thoughts

Loading Facebook Comments ...
Loading Disqus Comments ...