Android - How to reuse a wrapper layout for different layout XMLs? - android

I want to make every activity have a same wrapper layout like a drawer or a bottom toolbar. It's easy to create a BaseActivity to reuse the code for all activities. But how can I reuse the XML wrapper for all the different activity layouts instead of adding different contents into a same XML file dynamically?
For example, I have 5 XML layout files. They should have a same wrapper, and after I modify one of them, the others should be changed synchronously. A most simple example could be a drawer:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
// different content here
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/drawer_header"
app:menu="#menu/drawer" />
</android.support.v4.widget.DrawerLayout>

You can create an activity and add/remove fragments within it, this way the activity will hold all the common UI components and the distinct views will be in the fragments
http://developer.android.com/training/basics/fragments/index.html

You can create the layout separated and use tag, and, all your activities will inherit a "BaseActivity" which will set the content, and then, in your child activity, it will find the ID for the "content", and replace it.
Does that work for you?
Note that the content may be a simple ViewGroup to be replaced.

Related

Multiple Views Vs Multiple Fragments

I'm going to create a complex/normal design that has an empty screen layout & shimmer layout.
my question is to have all in one layout with multiple <include> files is better than doing two fragments and keep replacing them.
more details:
1- make the data screen shown & empty screen hidden as follows:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/toolbar"
layout="#layout/common_toolbar" />
<include layout="#layout/empty_layout"/>
// my data layout
</LinearLayout>
2- create a FrameLayout and keep change the container for different screens with multiple fragments:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
I need to know the best practice as depending on slow rendering of multiple views.
another question, is that included in for shown/hidden views or it depends on shown ones only as I got confused
and need to apply best practices.
if you attend to reuse some views Fragment is the best, otherwise, if you looking best to render I advise you to use constraint layout and section your views with a group so you can hide and show group
take a look to this one How to group multiple views in a ConstraintLayout

How do I add NavigationDrawer from an activity template to other activities?

I've been playing around with the Drawer Menu activity template from Android Studio since I haven't used a drawer menu before. Here's the layout file.
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools" android:id="#+id/drawer_layout"
android:layout_width="match_parent" android:layout_height="match_parent"
android:fitsSystemWindows="true" tools:openDrawer="start">
<!-- Includes a Toolbar and FloatingActionButton. Generated by Android Studio-->
<include layout="#layout/app_bar_drawer_menu" android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView android:id="#+id/nav_view"
android:layout_width="wrap_content" android:layout_height="match_parent"
android:layout_gravity="start" android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_drawer_menu"
app:menu="#menu/activity_side_menu_drawer" />
</android.support.v4.widget.DrawerLayout>
Android Studio also generated an Activity class as part of the template. My app has a main activity as well that uses a LinearLayout. I want to use Fragments to add the drawer menu to the main activity (and other activities), but I'm unsure how to do this. Do I need to create a new subclass of fragment and adapt DrawerMenuActivity's callback methods for the fragment class? Then do I add a fragment tag to activity_main.xml?
This will likely be something you need to wrap your head around...
Ideally, you want to swap fragments in a container located in the the xml for the MainActivity by using fragment transaction and calling replace with the fragment to be placed in the container. This will allow you to re-use the container and offer the drawer to the entire app.
Otherwise, you would need to include the drawer in every activity which creates a lot of extra code or not offer the drawer which depending on the activity you may be able to get away with that.
So, the drawer works with fragments being swapped in via the transaction and not so well for additional activities. Its something you need to design around.
Please, create a new project with a generated drawer for an Activity and proceed from there. Also read the android developer tutorial for fragments part on communication to see how the drawer fragment and activity communicate.
There's actually quite a bit involved for the drawer but you should be able to get a good grasp in a day or two.

How can I use Fragments to open items on a Drawerlayout, when i used the Activity Drawer Navigation Template that provides android studio?

Template that provide Android Studio
This is how I try to do. What is the R.id.x?. I tried using layout id in xml ActivityMain but not the fragment is displayed or overlaid with out activity information.
After selecting one of the items, the fragment will be displayed above the activity. The activity has several elements belonging to material design as the FAB or the Toolbar, Could this create problems with what I do?
In activity_main.xml try replacing:
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
With this:
<FrameLayout android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
And then use R.id.fragment_container as your R.id.x.
This will however replace the view with the FAB and coordinator layout. But you will probably want to add them to the fragments where you want them.
If not you could try replacing the xml found below in app_bar_main.xml, or wrap it in the FrameLayout.
<include layout="#layout/content_main"/>
Update:
Replacing in activity_main.xml will cause some issues as that removes the toolbar.
If you replace the include in app_bar_main.xml your fragments will most likely get overlapped by the toolbar at the top. To prevent this you could try adding app:layout_behavior="#string/appbar_scrolling_view_behavior" in the FrameLayout snippet above.
R.id.x is the id of the View that your fragment going to be replaced. So in your layout R.layout.xyz you have created a layout
<FrameLayout android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
and add/replace the fragment to that id. (R.id.fragment_container) such that your new fragment will be placed in that layout.
transaction.add(R.id.fragment_container, firstFragment)
At the end solved the problem using some of the recommendations made in the answers they provided me.
Change content_main.xml content. Using a FrameLayout with its correspodiente id.
Add fragment on onNavigationItemSelected(MenuItem item)
Result
When I press a menu item ...
...the fragment is displayed

How to share common layout between activities without fragment

Is there any possible way to share layout(part) between activities? For example, in my app, all activities have similar layout, the top part is long operation indicator (a progress bar, hidden when no operation is being executed), the bottom part is for showing errors. Only the middle part is different for all activities. See the picture below.
so my question is, is it possible to reuse the common layout(loading and error part) for all activities in my app? (currently I don't want to use fragment to do it for some reasons)
maybe the layout resources should like this:
layoutfolder
activity_common.xml
activity_one_content.xml
activity_two_content.xml
thanks
You can create an abstract 'base' activity that all your activities extend from, overriding setContentView to merge the base, and sub activity layouts.
This way you can handle all the loading/error code in the base activity, and simply toggle between hiding and showing the views in the sub activities.
The abstract activity:
public abstract class BaseActivity extends Activity {
protected RelativeLayout fullLayout;
protected FrameLayout subActivityContent;
#Override
public void setContentView(int layoutResID) {
fullLayout = (RelativeLayout) getLayoutInflater().inflate(R.layout.activity_base, null); // The base layout
subActivityContent = (FrameLayout) fullLayout.findViewById(R.id.content_frame); // The frame layout where the activity content is placed.
getLayoutInflater().inflate(layoutResID, subActivityContent, true); // Places the activity layout inside the activity content frame.
super.setContentView(fullLayout); // Sets the content view as the merged layouts.
}
}
the layout file:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- The main content view -->
<FrameLayout
android:id="#+id/loading_frame"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<!-- The main content view -->
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<FrameLayout
android:id="#+id/error_frame"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
You could use include in XML to, well.. include the re-useable part of your layout code.
As an example, here's my layout file for the Toolbar I used in my app:
// /res/layout/component_toolbar.xml
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:taggr="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/primary"
android:minHeight="?attr/actionBarSize"
taggr:popupTheme="#style/ThemeOverlay.AppCompat.Light"
taggr:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
Now, say if I want to use that Toolbar again in a different Activity, this is all I'd have to write:
// /res/layout/whatever_layout_this_might_be.xml
<include layout="#layout/component_toolbar" />
Bear in mind that this would only copy the layout - not the actual behavior of said widget/component.
If you want to actually copy all of the aspects (layout, behaviour) I'm afraid Fragment is the only way to go.
Although ActivityGroup is deprecated fro API 13 but if you don't wish to go with fragments then this can be your best choice.
According to documentation, an ActivityGroup is:
A screen that contains and runs multiple embedded activities.
You can find a tutorial here and here Although the mentioned tutorial uses a Tablayout you can replace that with your common layout in XML.
A second Approach could be Reuse the layout with include tag, in this approach you could just reuse your once created common layout everywhere in the app.

Declaratively defining fragments inside ViewPager

I have 5 unique pages of xml that are fairly complex. I want to put the 5 pages inside a ViewPager. All of the samples I can find simply put identical contents in each page via code. I want to declaratively define the xml in the viewpager like the xml pasted below. But this does not work - the app stops with this xml.
If I can't declaratively define it, then can I load individual xml pages into the viewpager? I can find no examples that do this.
thanks,
Gary Blakely
<?xml version="1.0" encoding="utf-8"?>
<fragment >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView android:layout_width="match_parent"
android:layout_height="match_parent" android:id="#+id/imageView1"
android:src="#drawable/flashright" android:adjustViewBounds="true" android:scaleType="fitXY">
</ImageView>
</LinearLayout>
</fragment>
<fragment >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView android:layout_width="match_parent"
android:layout_height="match_parent" android:id="#+id/imageView1"
android:src="#drawable/flashleft" android:adjustViewBounds="true" android:scaleType="fitXY">
</ImageView>
</LinearLayout>
</fragment>
If I follow, you want to declare everything in XML and avoid any programmatic initialization from within your Activity containing the ViewPager. The only way I can think of doing this would be to define 3 different Fragment classes which reference 3 different xml layouts. You could then embed them in your above xml, replacing each <Fragment> element with <FragmentX> <FragmentY> <FragmentZ> etc. Personally, I would rather write 3 xml layouts and create a single Fragment implementation that takes a single int argument to designate which layout to load, and then do the small amount of programmatic initialization necessary to make such a solution work. The rationale being that there is less duplicated code.
EDIT:
Another approach that might more fully address your requirements is to replace your <Fragment> tags with <Layout> tags and give them id's. Then in your Activity code, store refs to them, remove them from the View in onCreate() and finally add each of the stored references into programmatically created instances of Fragment which you then add to your ViewPager. Very ugly but thats the only way I know of to declaratively define everything in XML. You'll still have the problem that its not clear from the XML that these elements are nested within a ViewPager so personally I don't see the point. ListView and ListFragment operate with the same kind of implicit association though so its not unprecedented.

Categories

Resources