Develop Reference

Programmatically add Linear Layout

I am trying to add a new LinearLayout with a EditText element in it whenever a button on my app gets pushed. The xml I have is
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="#+id/app"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="1">
<EditText android:id="#+id/dish_name"
android:layout_width="match_parent"
android:layout_height="58dp"
android:hint="#string/dish_name"
android:background="#drawable/my_border"
android:paddingLeft="10dip"/>
<LinearLayout android:id="#+id/ingredient_list"
android:layout_width="match_parent"
android:layout_height="58dp"
android:weightSum="1"
android:layout_marginTop="20dp">
<EditText android:id="#+id/edit_message"
android:layout_width="0dp"
android:layout_height="42dp"
android:hint="#string/edit_message"
android:background="#drawable/my_border"
android:layout_weight="1"
android:paddingLeft="10dip"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_send"
android:onClick="sendMessage" />
</LinearLayout>
</LinearLayout>
I am trying to duplicate the second LinearLayout along with the EditText inside of it. The java code I have so far is:
public void sendMessage(View view) {
LinearLayout layout = new LinearLayout(this);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
layout.setOrientation(LinearLayout.HORIZONTAL);
layout.setWeightSum(1f);
params.weight = 1.0f;
params.setMargins(0,20,0,0);
EditText editText = new EditText(this);
editText.setBackgroundResource(R.drawable.my_border);
editText.setHint(R.string.edit_message);
editText.setLayoutParams(params);
LinearLayout container = (LinearLayout)findViewById(R.id.app);
container.addView(editText);
}
The problem I am running into is that when I click the button I get the following:
AppImage
I want the EditText box to be the same height as the one I have defined in the xml but it takes up the entire screen.
Any ideas?

No need to re-define the layout entirely within Java. You should define it as its own XML file. Call it ingredient_input.xml
For example, feel free to modify. This is one "row" for the EditText and button, so a horizontal layout. Could also be a RelativeLayout.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="58dp"
android:weightSum="1"
android:orientation="horizontal"
android:layout_marginTop="20dp">
<EditText android:id="#+id/edit_message"
android:layout_width="0dp"
android:layout_height="42dp"
android:hint="#string/edit_message"
android:background="#drawable/my_border"
android:layout_weight="1"
android:paddingLeft="10dip"/>
<Button
android:id="#+id/btnAddMore"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_send"/>
</LinearLayout>
First, you need to get the parent linear layout
LinearLayout ll = (LinearLayout) findViewById(R.id.ingredient_list);
Then, you can inflate the XML file for the "input row"
LayoutInflater inflater = LayoutInflater.from(MainActivity.this); // some context
View row = inflater.inflate(R.layout.ingredient_input, null);
You can also find the button, then set its click listener
row.findViewById(R.id.btnAddMore).setOnClickListener(...); // TODO
Then, just add that view onto the parent linear layout
ll.addView(row);
Realistically, you really could be using a ListView with an Adapter instead.

LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
In the code above, you have the height set to match_parent and widht set to wrap_content. Instead, try setting the height and the width to match your xml. The height should be 58dp and the width should be match parent.
Hope this helps!

I haven't the time to test this but you can try:
// assuming you have variables for ingredient_list and edit_message
LinearLayout.LayoutParams params = (LinearLayout.LayoutParams)ingredientList.getLayoutParams();
LinearLayout.LayoutParams editTextParams = (LinearLayout.LayoutParams)editMessage.getLayoutParams();
You can then use these instead of creating the parameters.
P.S. you don't have a specified orientation in your ingredient_list in the xml.

Adding a View to RelativeLayout changes its size

I have a RelativeLayout called "Dress" with LayoutParams of WRAP_CONTENT. All that is inside it is an ImageView, so it is the same size as the ImageView. When I add one more view to the RelativeLayout in OnCreate, like this:
photoSorter = new MultitouchImagesView(this.getApplicationContext());
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
((ViewGroup) findViewById(id.Dress)).addView(photoSorter, params);
The RelativeLayout called Dress changes size, to take up the whole RootView, basically the whole activity, minus the actionbar.
I take a screenshot of the Dress Layout. So when photoSorter is in the RootLayout (NOT the Dress Layout) like this:
photoSorter = new MultitouchImagesView(this.getApplicationContext());
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
addContentView(photoSorter, params);
Layout Dress is correct size and I get this screenshot which is what I want:
But I need PhotoSorter in the Dress Layout so that I can include it in my screenshot and not have the black strips. When I add the photoSortr to the Dress Layout like this:
photoSorter = new MultitouchImagesView(this.getApplicationContext());
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
((ViewGroup) findViewById(id.Dress)).addView(photoSorter, params);
It makes the Dress Layout take up the whole screen so the screenshot of the Dress Layout looks like this:
Here is my code to take a screenshot:
public Bitmap takeScreenshot() {
View v = findViewById(R.id.Dress);
v.setDrawingCacheEnabled(true);
return v.getDrawingCache();
}
Here is my XML for the activity:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:longClickable="true"
android:onClick="deleteImage"
android:background="#android:color/transparent"
tools:context=".MainActivity" >
<RelativeLayout
android:id="#+id/Dress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent" >
<ImageView
android:id="#+id/imageViewDress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:adjustViewBounds="true"
android:background="#00CED1"
android:padding="10dp"
android:scaleType="centerInside" />
</RelativeLayout>
<com.edmodo.cropper.CropImageView
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:id="#+id/CropImageView"
android:background="#android:color/transparent"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
Also When I added com.edmodo.cropper.CropImageView to the DressLayout, it made the Dress Layout take up the whole activity as well. So adding anything to the Dress Layout is making it bigger.
How can I add photoSorter to the Dress Layout without making Dress Layout take up the whole activity size?
Thanks.

I managed by trying things out in XML. The key is to align Dress with imageViewDress, I could align the other sides to be more thorough, not just bottom.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:longClickable="true"
android:background="#android:color/transparent"
tools:context=".DressingRoomActivity" >
<RelativeLayout
android:id="#+id/DressBig"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<ImageView
android:id="#+id/imageViewDress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:adjustViewBounds="true"
android:scaleType="centerInside" />
<RelativeLayout
android:id="#+id/Dress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:layout_alignBottom="#+id/imageViewDress"
android:layout_centerInParent="true" >
</RelativeLayout>
</RelativeLayout>
<com.edmodo.cropper.CropImageView
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:id="#+id/CropImageView"
android:background="#android:color/transparent"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
This XML, then add photoSorter to Dress programmatically, then take a screenshot of DressBig.

The following should work
<RelativeLayout android:id="#+id/Dress"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="...">
<ImageView
android:id="#+id/imageViewDress"
android:layout_width="match_parent"
android:layout_height="wrap_content"
...
android:scaleType="fitXY" />
EDIT:
You can add the below rule to your params so it's laid out over the other content if that's what you want. This is my third attempt at trying to figure out what you're asking for so if it's not what you need, you'll have to figure it out yourself seeing as you are being lazy and won't do a sketch to try and explain clearly how you want it laid out
params.addRule(RelativeLayout.CENTER_IN_PARENT);

Using LayoutInflater makes overlay transparent

First post here so apologize in advance for any mistakes.
I am trying to add some buttons as an overlay to a camera preview, and everything is working as expected except that the buttons get transparent no matter what I try when I want them to be opaque.
This is how I inflate the layout:
LayoutInflater inflater = getLayoutInflater();
View controls = inflater.inflate(R.layout.test, null);
LayoutParams layoutParamsControl = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
this.addContentView(controls, layoutParamsControl);
And this is how the xml file for the controls look like:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<Button
android:id="#+id/button_capture"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:text="Capture" />
<Button
android:id="#+id/button_mapview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:text="Map" />
</FrameLayout>
</LinearLayout>
My question is does anyone know why my buttons become transparent and how to fix it?

Try to add color as background like android:background="#ffffff" and accordingly add the text color which will be visible like android:textColor="#000000".

RelativeLayout width and height fill_parent doesn't work

This is my layout which is an info window, and its shown where there is new info to show to the user.
The layout should take the whole screen with some transparent background color, and a small text layout:
<?xml version="1.0" encoding="utf-8"?>
<!-- info fragment - used by the fragment to provide info on a specific fragment -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res/com.coapps.pico"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/background_dark_green" >
//this is the only layout i see in the result. not it's parent's layout...
<RelativeLayout
android:id="#+id/fragment_info_relativelayout_info"
android:layout_width="fill_parent"
android:layout_height="80dp"
android:layout_alignParentTop="true"
android:background="#drawable/background_info_window"
android:clickable="true" >
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerInParent="true"
android:layout_margin="5dp" >
<!-- The info textView -->
<com.coapps.pico.NillanTextView
android:id="#+id/fragment_info_textview_info"
style="#style/text_shadow_black"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:gravity="left"
android:text="Some Text "
android:textColor="#android:color/white"
app:isBold="true" />
</ScrollView>
<!-- Tap to close -->
<com.coapps.pico.NillanTextView
android:id="#+id/fragment_info_textview_tap_to_close"
style="#style/text_shadow_black"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:gravity="right"
android:paddingRight="5dp"
android:text="#string/button_tap_to_close"
android:textColor="#android:color/white"
app:isBold="true" />
</RelativeLayout>
</RelativeLayout>
I'm adding this layout to another ViewGroup like this:
/**
* Show the info window
*/
public void show()
{
//if the window is not visible
if (!isVisible())
//add window's view
rootView.addView(infoWindowView);
}
this code add the info window into its root view container in the last index.
in result i only see the second RelativeLayout which contains the text but i don't see its parent root layout which supposed to be transparent...
Any ideas why ?
Update:
This is my container:
<?xml version="1.0" encoding="utf-8"?>
<!-- This is the main layout of the application -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/fragment_basic_root"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</RelativeLayout>

I also had problems with a view in Relative layout that was dependent on the Relative layout's size.
I solved this problem problematically by updating the inner view size
private void update viewSize()
if(rootContainer == null || rootContainer.getLayoutParams() == null)
return;
rootContainer.measure(View.MeasureSpec.makeMeasureSpec(ScalingUtil.getScreenSize().getWidth(), View.MeasureSpec.EXACTLY), View.MeasureSpec.makeMeasureSpec(ViewGroup.LayoutParams.WRAP_CONTENT, View.MeasureSpec.EXACTLY));
RelativeLayout.LayoutParams oldLayoutParams = (RelativeLayout.LayoutParams) rootContainer.findViewById(R.id.deals_card_center_bg).getLayoutParams();
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(rootContainer.getMeasuredWidth(), rootContainer.getMeasuredHeight());
layoutParams.setMargins(oldLayoutParams.leftMargin, oldLayoutParams.topMargin, oldLayoutParams.rightMargin, oldLayoutParams.bottomMargin);
rootContainer.findViewById(R.id.deals_card_center_bg).setLayoutParams(layoutParams);

How to not have the parent expand
Instead of match_parent on the child, align it to the sibling that dictates the height.
<RelativeLayout ...>
<View
android:id="#+id/element_that_should_match_its_parents_height"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignBottom="#+id/element_that_dictates_height" />
<View
android:id="#+id/element_that_dictates_height"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
Worked for me, hope it helps. The second View is usually some ViewGroup, that varies in height.

Try change
<RelativeLayout
android:id="#+id/fragment_info_relativelayout_info"
android:layout_width="fill_parent"
android:layout_height="80dp"
android:layout_alignParentTop="true"
android:background="#drawable/background_info_window"
android:clickable="true" >
to
<RelativeLayout
android:id="#+id/fragment_info_relativelayout_info"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:background="#drawable/background_info_window"
android:clickable="true" >
Anyway, why the need of nested RelativeLayout ?
I see how do you add the view, so try also this:
infoWindowView.setLayoutParams(
new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));
rootView.addView(infoWindowView);

SurfaceView Inflate Button to be centred at the bottom of portrait orientation

I'm rolling my own camera app and for that I'm using a SurfaceView with Landscape orientation as standard.
What I'm trying to do is, inflate the SurfaceView to have a button. But I want the button to appear centred at the bottom of portrait orientation, like most stock camera apps. The layout for button that I'm inflating is as below, I'm not sure what combination of controls will give me the desired result.
My Layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="right"
>
<Button
android:id="#+id/takepicture"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" * Take Picture "
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_margin="10px"
/>
</LinearLayout>
Thanks for your help! =]

Play around layout_weight. Try this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="right"
>
<com.YOURSurfaceView android:layout_width="fill_parent" android:background="#ff0" android:layout_weight=".2"
android:layout_height="fill_parent" >
</com.YOURSurfaceView>
<Button
android:id="#+id/takepicture"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text=" * Take Picture "
android:layout_weight="1"
android:layout_margin="10px"
/>
</LinearLayout>

Thanks Ares, for your answer. I dug around a bit more on here, and found a solution with LinearLayout, but from what I understand, everything has its place but in general RelativeLayout gives better performance, so I experimented a bit, and I got this now, which works for me. Please note, I'm using an image as the button, so you'd probably want to upgrade it include other buttons on press etc and scale it appropriately (which is what I will do next). But in barebones, this is what is working for me.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:baselineAligned="false"
android:gravity="right"
android:orientation="horizontal" >
<RelativeLayout
android:layout_width="40dp"
android:layout_height="fill_parent"
android:gravity="center_vertical" >
<ImageButton
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:src="#drawable/lens_2" />
</RelativeLayout>
</RelativeLayout>
The above is inflated on my SurfaceView, which I declare like this :
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
getWindow().addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
mPreview = new CameraPreview(this);
setContentView(mPreview);
LayoutInflater controlInflater = LayoutInflater.from(getBaseContext());
View viewControl = controlInflater.inflate(R.layout.control, null);
LayoutParams layoutParamsControl
= new LayoutParams(LayoutParams.MATCH_PARENT,
LayoutParams.MATCH_PARENT);
this.addContentView(viewControl, layoutParamsControl);
}
Hope this helps.