I want to make my xml layout more modular because this one is going to be pretty intricate!
I want some pieces to be in their own xml files. How would I reference them properly in the main XML file.
for instance
Lets say I have a
<relative layout>
<linear layout>
<relative layout>
<frame layout>
<relative layout>
<linear layout>
but the <frame layout> has a very complex child, with columns containing buttons and scrollviews which contain listviews.
I would like to develop the frame layout in its own XML and then merely reference that xml document within my main one
what would the syntax for that look like? is it solely related to the ID that assign to <frame layout> within my main XML?
The article Layout Tricks: Merging Layouts describes the <merge> and the <include> tag for layout xml files.
With <include> you can reference an other layout and <merge> can help to make your view hierarchy flatter.
Related
I have some general question about layouts in my application I ma trying to make. I have attached a screenshot of how this is suppose to look like. There are 2 headers at the top (search bar with back button), another list of properties (Crag, Grade...). Then we have vertical scrollable table layout.
This is little bit of beginner question, but what layouts would I use to create such page, for example something like this (of course this would need to go in more details to handle all information, but as in rough layout?
<Relative layout>
<Frame layout> search bar </Frame layout>
<Frame layout> list of properties (Crag, Grade...) </Frame layout>
<Table layout> vertical scrollable </Table layout>
</Relative layout>
You can do something like below
<LinearLayout orientation=vertical>
<Toolbar> search bar </Toolbar>
<LinearLayout orientation=horizontal> list of properties (Crag, Grade...) </LinearLayout>
<RecyclerView>
</LinearLayout>
In the following link: FrameLayout it is written:
FrameLayout is designed to block out an area on the screen to display a single item. Generally, FrameLayout should be used to hold a single child view, because it can be difficult to organize child views in a way that's scalable to different screen sizes without the children overlapping each other.
From the way i understand this quote, it means that it is recommended to add only one child to FrameLayout (although it possible to use more than one in order to make each view to overlap his "brother"). But, i can't understand the use of the FrameLayout only with one child, Let's say a LinearLayout. What is the difference between starting a layout file with a LinearLayout as the root of the xml file (see code 1), or wrapping it with a FrameLayout as the root, and then placing a LinearLayout has is son that will be the father of many other ViewGroup and View (see code 2)?
Code 2:
<FrameLayout
...>
<LinearLayout
...>
<ImageView .... />
<TextView .../>
</LinearLayout>
</FrameLayout>
code 1:
<LinearLayout...>
<ImageView.../>
<TextView.../>
</LinearLayout>
I'm currently trying to implement Paralloid by chrisjenx for Android. It uses a FrameLayout that hosts two different layouts that take up the entire screen size. I need to perform an event during an ImageView's onClick(). The ImageView is located in the first layout.
For example:
<Frame Layout>
<Relative Layout>
<ImageView/>
<!-- Need this guys onclick, nothing outputted though. -->
</Relative Layout>
<chris.jenx.paralloid/>
</Frame Layout>
I've even gone as far as making sure Relative Layout and Image View both have clickable="true" and focusable="true". No Luck.
Have you tried setting the Image clickable property to true?
android:clickable="true";
I have a FrameLayout that contains a TextView and two LinearLayouts:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
... a textview and 2 linearlayouts
</FrameLayout>
After running Android Lint, I get this warning: This <FrameLayout> can be replaced with a <merge> tag.
Why does this warning exist? What can I do to fix it (other than ignore)?
To understand this, you need to understand how layouts are inflated and placed.
Let's say for example, you have an activity and this is the layout xml you use. Here is what the layout of the activity looks before you put your layout file.
<FrameLayout> // This is the window
<FrameLayout> // This is activity
</FrameLayout>
</FrameLayout>
There might be few other layers depending on the device/OS.
Now when you inflate your layout file and put it in, this is how it will look.
<FrameLayout> // This is the window
<FrameLayout> // This is activity
//A textview and 2 linearlayouts
</FrameLayout>
</FrameLayout>
Do you see the FrameLayout inside the other FrameLayout? It is redundant to have that since it does not add much value. To optimize, you can replace your outer FrameLayout with the <merge> tag. This is what it will look like.
<merge> // This is the window
<FrameLayout> // This is activity
//A textview and 2 linearlayouts
</FrameLayout>
</merge>
Notice how there is no extra FrameLayout. Instead, it is just merged with the FrameLayout of the activity. Whenever you can, you should use <merge>. This doesn't only apply to FrameLayouts. You can read more about it here. http://developer.android.com/training/improving-layouts/reusing-layouts.html#Merge
Hope this helps.
Are you using this as the main layout of your activity? If so, you can replace it with a merge tag like this:
<merge xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
... a textview and 2 linearlayouts
</merge>
At setContentView, Android will take the children of the merge tag and directly insert them to the FrameLayout with #android:id/content. Examine both approaches (FrameLayout vs merge) with HierarachyViewer to see the difference.
Refer this post by the Romain Guy for more information. It tells you why the merge option is suggested.
To render the XML in the device a process is followed in phases, and the first one is Measure.
Measure: In this phase, the sizes of the parent and their children and
their children, and so on, is measured. So your CPU scans all the
ViewGroup and View in your layout to measure their sizes. And sometimes for some
reasons, it may require this scanning recursively because of the
dependency of the size of the parent and their children on each other.
So why Lint is giving this warning?
Because your XML eventually will be loaded into a window which contains FrameLayout and in your XML file you are also using the FrameLayout, so eventually your XML will be placed in
FrameLayout of the window and it will be like this:
<FrameLayout> <!--belongs to window-->
<FrameLayout> <!--belongs to your XML-->
...
</FrameLayout>
</FrameLayout>
Now there is an overhead for CPU in the measure phase, to measure both the FrameLayout. And this overhead can be overcome if we can somehow manage to use the outer FrameLayout in our XML, that's exactly possible via merge tag.
I am new to layouts in android and would like to implement a layout like the one shown below however I am a bit confused as to how I should layer my layouts in XML.
I am currently trying a:
<LinearLayout>
<RelativeLayout>
<ImageView>
<TextView>
</RelativeLayout>
<LinearLayout>
<ImageView>
<TextView>
<ImageView>
<TextView>
</LinearLayout>
</LinearLayout>
I don't want to over complicate my layout structure. Would there be a better way to structure this?
Might be best to have a look at this link. As a rule of thumb, don't try and nest layouts too much, i.e. keep them as shallow as possible.
So relative layouts are usually better in this case.
http://developer.android.com/resources/articles/layout-tricks-efficiency.html