I have just started learning Android. Few confusions I have regarding layouts in XML
Are all views that I define in my layout are essentially inflated or they are optional? Suppose I have two different views in a view-group but I want to
use only first or only second conditionally. Is it possible?
How dynamically created views deal with layout.XML
file?
If I want received messages to be shown in red and sent messages in black how can I do that?
You can include views in the XML layout file that are invisible until you programatically display them. Just use "android:visible="gone" or "android:visible="invisible" in the XML file.
For instance, I include the following in my layout file initially but it's not visible:
<LinearLayout
android:id="#+id/pnlLatLong"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:visibility="gone"
>
<TextView
android:id="#+id/lblLatLng"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/lat_long"
/>
<EditText
android:id="#+id/txtLatitude"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="numberDecimal|numberSigned"
/>
<EditText
android:id="#+id/txtLongitude"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="numberDecimal|numberSigned"
/>
</LinearLayout>
In Java code, when the code logic dictates it should be visible, I change the visibility programatically to:
View v = findViewById(R.id.pnlLatLng);
v.setVisibility(View.VISIBLE);
you can set android:visibility="gone" in xml or by code setVisibility(View.gone); for change text color you can set android:text color="#000000" or by code setTextColor();
Related
I am making a screen for the addition of a contact.
For the phones and phone types I have an EditText and a Spinner type and these are included in a LinearLayout
If I add my Layout on a xml and inflate it to reuse it as many times as required, the result is quite different.
LinearLayout phoneLayout= (LinearLayout) inflater.from(ctx).inflate(R.layout.add_contact_phone_element, container, false);
Specifically, there are 3 differences I need help with how to solve them, and if possible why they happen.
On the first image you can see one field how it seems at the original xml and how it looks when added programmatically from another xml.
The text color is white at the inflated field
Spinner color is white at the inflated field when non expanded
When expanded, the spinner is different from the original (photos 2,3). On the expanded, its black background with white color on the text.
What is wrong and they appear so differently?
You can see the code here. The same code is included at the original xml, its just copy-pasted to another so it can be reused.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/phone1Cont"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="#id/phoneImg"
android:orientation="horizontal">
<EditText
android:id="#+id/InputPhoneValue"
style="#style/Dialog.Contact.AddText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1.5"
android:hint="#string/JournalDetailViewPhoneLabel"
android:inputType="phone" />
<Spinner
android:id="#+id/phoneTypeSpinner"
style="#style/Widget.AppCompat.Spinner.Underlined"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:layout_toRightOf="#+id/InputPhoneValue"
android:layout_weight="1"
android:backgroundTint="#color/grey"
android:entries="#array/phone_type" />
</LinearLayout>
I have a layout contain one image and 3 text field
I've tried to align the image to right and text field to left but I've failed
I've used
android:layout_gravity="right" for image and left to text but it did not work also I've used end and start in gravity with no success
this is the layout code:
<?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="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
android:layout_marginBottom="2dp"
android:orientation="vertical"
android:background="#drawable/card_background">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/listthumb"
android:layout_width="80dp"
android:layout_height="50dp"
android:layout_gravity="center_vertical"
android:contentDescription="Rss video thumbnail"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/listtitle"
style="#style/listTitle"
android:maxLines="3"/>
</LinearLayout>
<TextView
android:id="#+id/shortdescription"
android:layout_width="wrap_content"
android:ellipsize="end"
android:maxLines="2"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/listpubdate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="11dp"/>
</LinearLayout>
</FrameLayout>
Try to use a <RelativeLayout> instead of a <LinearLayout>
With the RelativeLayout you could place a widget depending on the position of another widget
Here the Relative Layout description
Hope this will help, I have not had time to test....
One linear layout should have vertical orientation and contain the 3 text fields.
One linear layout should have horizontal orientation and contain both the above linear layout and the image.
To push two views to the edges of the screen, you can also give each a left/right margin and then put a blank view with weight = 1 in between them.
Please read a bit more on how layouts work on Android and the different types available to you. A LinearLayout will stack the containing Views either Horizontally or Vertically one after the other. A FrameLayout is simply a container and the items within have to position themselves. RelativeLayout allow you to position your views with a relative reference to other views (in your case, you can position your ImageView, and then your 3 TextViews relative to where the ImageView is).
If you can use LinearLayout instead of RelativeLayout, you should do so, as RelativeLayout is always slower, due to having to perform two passes prior to rendering as it needs to measure each view and then also perform the layouts based on that. You might be looking for something like (pseudo-code):
<LinearLayout orientation=horizontal>
<LinearLayout orientation=vertical>
<TextView />
<TextView />
<TextView />
</LinearLayout>
<ImageView />
</LinearLayout>
You have not described your question well . Check below code if it works .
You just forgot to add orientation in linear layout containing one text view and a Image view .
Add Orientation to Your Linear Layout.
I am having some spacing trouble when building part of my UI programmatically in Android 4.0. I am trying to add stylized buttons to a stylized LinearLayout. To space the buttons equally, each one is wrapped in a LinearLayout with a weight of 1. I started with a layout defined in XML (somewhat of a proof of concept,) which renders like I expect:
<LinearLayout android:id="#+id/dialog_footer"
android:layout_width="500dp"
android:layout_height="wrap_content"
android:background="#drawable/dialog_footer">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="center">
<Button android:id="#+id/cancel"
style="#style/Button"
android:layout_width="130dp"
android:layout_height="38dp"
android:text="Cancel" />
</LinearLayout>
<!-- Another LinearLayout with a nested Button like the one above -->
</LinearLayout>
To add buttons programmatically, I removed the inner LinearLayouts and put them in their own layout file that I can inflate and add to the outer LinearLayout in Java. It is nearly identical.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="center" >
<Button android:id="#+id/button"
style="#style/Button"
android:layout_width="130dp"
android:layout_height="38dp" />
</LinearLayout>
And this is roughly how I'm adding buttons in code:
LinearLayout dialogFooter = (LinearLayout)dialogView.findViewById(R.id.dialog_footer);
LinearLayout wrappedButton = (LinearLayout)getLayoutInflater().inflate(R.layout.dialog_button_wrapped, null);
Button button = (Button)wrappedButton.findViewById(R.id.button);
button.setText(R.string.button_one_text);
// button.setOnClickListener(...);
dialogFooter.addView(wrappedButton);
The buttons appear but now they are grouped together and shifted to the left. Is there something Android does when it parses a Layout that I would need to do myself if I'm adding to the dialog_footer? Since weights come into play here, I thought that calling setWeightSum() on the container I'm adding to (dialog_footer) might be necessary but that didn't help. Does anyone have any ideas what might be causing the difference between the XML and Java approaches?
I believe this is your problem:
LinearLayout wrappedButton = (LinearLayout)getLayoutInflater().inflate(R.layout.dialog_button_wrapped, null);
The null should be replaced with the parent view , so that it will get the layoutParams you want to set for it .
Another thing is about the weight you set - you should set the width/height to 0px so that the weight won't cause the layout process work in a weird/inefficient way .
BTW , you can remove the inner layout (that has the button) and use a single button instead. just set the layout_gravity there to center_horizontal .
I have to put two text views in one line. Second one should be placed next to first one (as shown in figure 1).
My problem is: text of first text view may be long so I need to ellipsize it. It should take as much space as needed to make it possible to read the whole text in second text view. Figure 2 shows it.
Is it possible to achieve that using Android built-in layours or I need to write my custom view?
Create an inner layout and use the android:weightSum="100" attribute. Then place two text views insode this inner layout and add the attribute android:layout_weight="50" to each textview!
Try something like this
<?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="horizontal" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ellipsize="end"
android:text="A long long text" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="A long text" />
</LinearLayout>
Regards
[Second Edited]
I found where problem is. But i dont know why its doing. It cant be margin on LinearLayout (or just marginLeft). Does anybody know why it cant have ?
[EDITED]
Hello i have xml file in layout like bellow.And iam adding TextViews from any xml layout to horizontal LinearLayout. This layout structure is given and i cant change it.
And last added TextView is streching always verticaly. I dont know why i am in tottaly despair. Too many hours i was try* that but without no idea. I know just its not in programicaly adding TextViews ..
If some body know why its doing i will be thankful.
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/back_border"
>
<RelativeLayout
android:id="#+id/manager_view_table_header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
>
<LinearLayout
android:id="#+id/layout_for_textViews"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="6px"
android:layout_alignParentTop="true"
android:gravity="center_vertical"
android:background="#drawable/back_border"
>
<!-- horizontal layout, HERE IAM ADDING TEXTVIEWS -->
</LinearLayout>
</RelativeLayout>
<!--What is here its no important
because, there is RelativeLayout with alignBellow relative layout before -->
</RelativeLayout>
and TextView witch iam addig to LinearLayout:
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="15sp"
android:paddingRight="7px"
android:paddingLeft="7px"
android:paddingTop="3px"
android:paddingBottom="3px"
android:layout_marginLeft="5px"
android:gravity="center_horizontal"
android:background="#drawable/background_table"
android:textColor="#330033"
android:text="Some text"
/>
Try to replace the android:layout_margin="6px" from the LinearLayout by android:padding="6px".
I think this will solve your problem. I mean the new LInearLayout should be like this:
<LinearLayout
android:id="#+id/layout_for_textViews"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="6px"
android:layout_alignParentTop="true"
android:gravity="center_vertical"
android:background="#44ff435f"
>
I am confused with your three layouts. Wat's the porpose of all thses nested layouts, try to recreate the text views with a single relative layout, and use the android:layout_above and android:layout_below for placing the text views.
First of all you need to refactor this code.
You might want to use actual ListView to create repeated elements.
and why is xmlns:android="http://schemas.android.com/apk/res/android" declared thrice in this xml code, when it is actually required just once at top root element.
Even with this layout to solve your problem, if other things are not working a nice idea would be to switch to Graphic layout(bottom tab in eclipse when on .xml file) and manually try to set the third TextView (not listview) height manually, you can observe the changes then and finalize them accordingly..