Develop Reference

Can I show a sample view when the layout is normally empty & only populated programmatically?

I have a linear layout that I normally add ImageViews to programmatically, but I'd like to render better previews inside Android Studio when looking at layouts.
I can't use tools:src as mentioned here because I don't have any ImageView at all in the XML until runtime.
As a really naive approach, this works visually in Android Studio:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include tools:layout="#layout/some_sample_layout"/>
</LinearLayout>
If #layout/some_sample_layout is then another LinearLayout:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:scaleType="centerCrop"
tools:src="#tools:sample/backgrounds/scenic" />
</LinearLayout>
But while it displays OK in Android Studio, it fails to compile:
Execution failed for task ':app:mergeDebugResources'.
> main_layout.xml: Error: ERROR: [44 68 44 68 25] must include a layout file:///main_layout.xml
Ideally I think that I'm looking for:
some way to add an ImageView directly to the main LinearLayout but mark the whole view as "ignore unless tools" or
to be able to "swap" in the body of the LinearLayout somehow.
Is this possible with tools at the moment?

I think the cleanest and most universal approach for displaying dynamically inflated views in AS designer would be to use <include /> tag, quite similar as in your example.
Our <include /> tag must have layout property, to make the app buildable. We can omit it by attaching dummy layout with <merge /> root. Because it has no children, no views will be inflated.
Universal lt_merge_empty.xml:
<?xml version="1.0" encoding="utf-8"?>
<merge
xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="0dp"
android:layout_height="0dp">
<!--
Empty merge tag, so we can use <include/> to show dynamically inflated layouts in designer windows
For example:
<include
tools:layout="#layout/your_inflated_layout"
layout="#layout/lt_merge_empty"
/>
-->
</merge>
Then use it in your layout:
<include
tools:layout="#layout/your_inflated_layout"
layout="#layout/lt_merge_empty"
/>
Please note: for some reason, tools:layout must be placed above layout property, otherwise it won't be rendered.
Edit: This approach is more universal than #Sina's one bacause usually you will want to display the exact layout that you are dynamically inflating, so obviously you can't change its android:visibility to gone.

You must include a layout so include it but set its visibility to gone or set ImageView sizes to zero while having what you like with tools attributes. Here I've done both.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="#layout/some_sample_layout"/>
</LinearLayout>
<LinearLayout
android:visibility="gone"
tools:visibility="visible"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="0dp"
android:layout_height="0dp"
tools:layout_width="100dp"
tools:layout_height="100dp"
tools:scaleType="centerCrop"
tools:src="#tools:sample/backgrounds/scenic" />
</LinearLayout>

Android: Better way to generate buttons

So far, my app is pretty simplistic and small. It has a few buttons here and there, but I can see it quickly getting out of hands with a ton of buttons. So my problem really, my activity_main.xml looks ridiculously ugly. It has a bunch of tags, so I was wondering, what's the "correct" way to generate buttons when you have a lot of these?

Use XML do define views. I would always recommend you to use xml, even if there are 20 Buttons.
Alternativly you can also set the button programmatically in code and at them to your layout. Just set the layout parameters and you are done.
Otherwise (if you have a list of many buttons and you need to scroll) a ListView or GridView would a good choice.

To make things cleaner in your XML, you can use include to reference other XML which defines a generic button with all its common properties.
So the button would be defined under genericbutton.xml placed in the layout folder:
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="onClick" />
</merge>
And then your main activity_main.xml will have something like this for three buttons:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<include
android:id="#+id/button1"
layout="#layout/genericbutton" />
<include
android:id="#+id/button2"
layout="#layout/genericbutton" />
<include
android:id="#+id/button3"
layout="#layout/genericbutton" />
</LinearLayout>
But in this case, you either set the same text for the buttons inside the genericbutton.xml or one by one in Java code. You cannot set it in the include tags.

Place a footer for each activity

I'm trying to place a TextView at the bottom of every activity by using the include... My code is below... I don't know why, but it remains at top... Although it works fine for TextView.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:background="#E0E0E0"
android:orientation="vertical" />
<include
android:layout_alignParentBottom="true"
android:id="#+id/footer"
layout="#layout/footer" />
<TextView
android:id="#+id/textView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:layout_alignParentBottom="true"
android:text="Hello"
android:textColor="#000000"
android:textSize="15dp" />

¿Maybe you are using a LinearLayout instead of a RelativeLayout? The latter doesn't have android:orientation property. We don't see the parent XML node, so just a guess
Also, you'll need to place the include at the bottom and the TextView above it
<TextView
...
android:layout_above="#id/footer" />
Right now you are overlapping both views
Another suggestion is to use FragmentActivity and a Fragment to handle the Footer, but that's out of the scope of this question.

Use RelativeLayout in your same xml code as the parent layout.

Well i got the solution.... I had to add the include inside another child relative layout...This is what i did..
enter code here
RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<include
android:id="#+id/footer"
android:layout_alignParentBottom="true"
layout="#layout/footer" />
</RelativeLayout>
but...for a textview it works directly without using another child layout...So why do you need to do this for an include.....????:|

I checked your code. It works fine as posted in 1st post.
Please note that when you use layout tag then Eclipse' Graphical Layout won't draw the child xml-layout you've included (in your case footer.xml).
At the same time, you'll get a footer like you want if you run same code on actual device or emulator.
NOTE: you might want to remove android:layout_alignParentBottom="true" from textView1 as currently textView1 and footer layouts overlaps.

LinearLayout isn't stretching. Filename collision?

Would you mind pointing out the reason why LinearLayout element isn't stretching to match parent element. Is this related to project configuration or class names I use ? I've noticed that name of the xmlfile might be somehow related to this issue. I'm not joking - a couple of days ago I was testing the same code on different xml file names and it worked differently in terms of LinearLayout stretching. This one is named "clip.xml"
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true" >
<VideoView
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
</LinearLayout>
</FrameLayout>
Thanks

i see nothing wrong with what you did , but you won't notice a thing in the linearLayout since it doesn't contain anything .
in order to demonstrate it , try setting a background for the linearLayout , for example :
android:background="#88ff000000"

Can some clarify usage of <include> and <merge>

I just need someone to tell me if I understood correctly when to use <include> and when <merge>.
So, I make a header layout which I want to include into some other XML layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Header text" />
</LinearLayout>
And I include it into some other XML this way (which is pretty basic):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<include
android:id="#+id/header"
layout="#layout/top"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
This will work well, no issue about it. But in order to optimize the code, I have to use <merge> in the layout which gets included. So the top layout should not have a tag <LinearLayout> but it must look like this:
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Header text" />
</merge>
Have I understood this correctly?

From my understanding it will set the merge element as the higher element in the view hierarchy. Include will simply put the whole viewgroup in there. So using your example the view hierarchy should look like:
With merge:
LinearLayout (root)
|
TextView
With include:
LinearLayout (root)
|
LinearLayout
|
TextView
So you will have an extra LinearLayout in the view hierarchy that you do not need. However, sometimes you need that intermediate view. In your case, you wouldn't, since both the LinearLayouts have the same layout params and no other differences.

Yes you understood it correctly. merge is used as pseudo parent element to reduce the number of levels in view trees.
Just check this link, it gives very good explanation of merge.
In your header file:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<include
android:id="#+id/header"
layout="#layout/top"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout> doesn't make any difference when your file is included in other file you mentioned. So it's a good thing to use merge instead.
Since in XML you must use a single parent element and the rest of the XML elements should be included in it, you should use merge as single parent element and can avoid adding unnecessary parent layout.
Just avoid 'merge' when you want to apply a layout differently than layout is defined in file in which your content is inclded.