Creating new Views by Drag and Drop & Controlling them (custom layouts) - android

The main purpose of the app is to provide education courses for students.
I have two actors:
Teachers who create the content of the course from inside the android app
where the lesson could be any combination of android views.
Students who view these courses and interact with lessons, may be click button to hear sound (Only view this lessons)
Stage 1 : Implementing drag and drop editor
So far I have been able to create new Views (ImageViews TextViews ... etc) & drop them in new layout.
But once I drop them I have no control on them any longer. Now I am restricted to one style of layout, which I do not want. I want to reach the level of android studio layout editor, where I can add Views, change their position, size, etc.
Stage 2 : Save layout
Would you suggest a way to save layout data to be shown to Students. JSON? XML?
Stage 3: Parsing Layout data
I have implemented XML parser and tested it using a layout that I had created in android studio. However, depending on your suggestion I may change the way I parse the lesson.
Drag & DropLayout Editor - Instructor Layout - Student Layout - Android Studio

I would suggest the following:
Stage 1
Create custom views for all widgets which can be dropped (LinearLayout, ImageView, etc). Let them all implement the following interface:
interface Layout {
Layout getLayout();
LayoutEditor getLayoutEditor();
}
Where Layout is the serializable representation of that view's layout (XML or JSON) and LayoutEditor is another interface which can used to modify the attributes on that View (layout_width, layout_height background, etc)
Stage 2
So after you have dragged and dropped widgets on to say the app canvas you get a view hierarchy of Views which implement Layout interface. Just walk this tree recursively and call getLayout() on each view and stitch together a Layout hierarchy. Which you can then serialize and save.
Stage 3
You deserialize the Layout you saved and walk through the layout tree and recreate the View hierarchy with it.
Check out proteus for some inpiration. This uses JSON layouts to inflate native Android views.

Related

How Can i replicate Photoshop like functionality to save and restore UI Layouts?

I built an android application in which user can add views like edit text, text views & image views to Relative layout and export the layout as image . But most of my users requesting feature to save their work as template to work on it later point just as like .PSD file in Photoshop. I am unable to find a Way to achieve this. How can I save Views and its properties inside a layout to inflate them later at any point of time.
I think you can try this way. Although I haven't written the relevant code, I think it is feasible.
You can create a class, this class has the following properties:
View type
View level
View's superView
View's subViews
Size
Layouts
etc.(you can add it according to your needs.)
Then convert each View into this class, save all the converted classes to the local, when the next time you need to use, you can read all the classes saved locally last time, and according to the class attributes, such as view type, view level, size, layouts and other attributes create all views in turn.

Creating a custom android view within another custom android view

So, I have the basic structure of creating a custom android view component locked down (i.e. create the view's layout xml, create a class for that view that references the layout xml, and then use the class name in an layout xml that uses the custom view) and that's all fine.
However, if I have a set of custom android UI components, can I combine them to create an even bigger custom android UI component? And if so, how would i reference the "inner" custom android UI components in the class that defines the "outer" android UI component?
The real issue here is that the TypedArray Class used to extract values for a custom UI component has only methods for extracting individual attributes (e.g. there is a "getString()" but no "[] getString()" that would return an array of strings that would then be used to update a set of custom UI components at once).
Is it possible in android to create a composite custom android UI component made up of custom android UI components?
(updated: Here is a link. http://postimg.org/image/nbnfq4nlp/2916ab5b/. Here a set of one QRCode Image, time and location TextViews form one Custom View (QRCodeScanItemView) while a group of QRCodeScanItemViews and the prominent date form another View)

Is there a way to add layouts at runtime to an Android app?

I want to create an app to which I can add layouts over time. E.g. The app ships with a known set of layouts, but can download new theme packs without having to distribute a new apk. I don't expect these to be stored in the layouts directory - they can be stored anywhere the app can access as long as I have a way of loading them.
It looks like layouts need to be compiled into binary form if I'm going to use them with the LayoutInflator. So is there a way to compile them before distribution? I would really rather not have to write an interpreter for these as I'm sure it would be quite a bit slower.
This layout file in another layout via LayoutInflater.
Suppose, You want to add this layout in your main layout. So, Take a linear layout in main layout and this list layout in main layout via mainlayout.add(view) , Here view is LayoutInflater viw.
Example :
private View view;
view = getLayoutInflater().inflate(R.layout.image_sub_layout,null);
topicLinearLayout.addView(view); // main Layout Linear layout
Thanks.

Custom controls/inflating an XML onto an Android layout?

I have a standard layout and i have to populate it at runtime with a number of controls/views i.e. TextView / EditText depending on the number of products that come back from a REST service.
Of course the control I wish to add to the layout at runtime needs to contain a number of views (textview, edittext) etc. I was thinking a custom control to bring all the controls I need I am unsure.
The other idea I had was to inflate and existing XML into my layout but I am unsure if this is possible or if it was or would I control the ID names - inserting more than 1 would cause duplicate id's?
I will try and explain in detail what I am trying to do, we can wrap it in a for loop for test which would count form 1 to 5 hence 5 controls would get populated on my layout.
The custom controls would have a TextView which describes the product. The Edit text where the user can enter freely the amount in numbers using the virtual keyboard and a spinner control to the right of the EditText which would allow the increasing of the EdtiText value.
So all pretty simple eh ? :-) but of could I class all these controls as 1 specific view and I need to a number of them on my layout hence if there were 5 products there would be 5 custom controls, each custom control contain controls i.e. TextView, EditText and Spinner.
How can I accomplish this?
The examples I have seen have been inheriting from VIEW but I need my VIEW (CUSTOM CONTROL) to be a container for a number of other controls and then later be able to dynamically add this new custom control onto my Activity Layout.
What about using a ListView with custom adapter...
check http://www.ezzylearning.com/tutorial.aspx?tid=1763429
http://www.framentos.com/en/android-tutorial/2012/07/16/listview-in-android-using-custom-listadapter-and-viewcache/
You may want to use a ListView with a custom Adapter, and update the adapter with the information from the service.

listview reusable component - architecture - android

i have a complex view which contains 4 list views arranged as per the requirement. i have been been able to implement and get it working. but this is a sole activity and data needs to supplied internally (within the activity).
i want to define a way where in, this complex view is like a reusable component which is called by other activities that provide data for all 4 list views and then the view shows up in the screen.
could somebody please guide me as to how do i go about achieving this functionality.
You should define your listview structure in a layout file of its own. Then you can use whats called inflation, which lets you "inject" seperate layout files into your main layout in run-time. Take a look at:
http://developer.android.com/reference/android/view/LayoutInflater.html
Take note at the introductory notes. Android is already inflating an XML resource, namely the layout file you´ve defined in setContentView(), you can grab the current instance of the inflater and use it as you see fit, saving greatly on memory as opposed to instantiating it yourself.

Categories

Resources