How to set different Layouts in 1 XML file in Android - android

Hi friends i have set my layout thru TabLayout within LinearLayout but still my button in the end couldn't be set properly as TabLayout divides all the fields in number of columns so can anyone help how to set 2 Layouts in one XML file
means all the fields in TabLayout and remaining both Login and Register buttons in Linear Layout ore some other so that they can set properly.
Thanks in advance.
Layout
Username ! EditTextBox
Password ! EditTextBox
Login ! Register
Button ! Button
I want my Layout in above Format so i have used TabLaout but in that case it is causing my button's view as well as it is stretching one button than other one as EditText is larger than TextView
<?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"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:textSize="26sp"
android:text="#string/login_text"/>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TableRow>
<TextView
android:layout_width="120px"
android:text="User name"
/>
<EditText
android:id="#+id/txtUserName"
android:singleLine="true"
android:maxLength="20"
android:width="195px"
/>
</TableRow>
<TableRow>
<TextView
android:layout_width="120px"
android:text="Password"
/>
<EditText
android:id="#+id/txtPassword"
android:width="195px"
android:maxLength="20"
android:singleLine="true"
android:password="true"
/>
</TableRow>
<TableRow>
<TextView />
<CheckBox android:id="#+id/chkRememberPassword"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Remember Password"
/>
</TableRow>
<TableRow>
<Button
android:id="#+id/buttonRegister"
android:text="Register"
android:layout_width="124px"
android:layout_height="wrap_content"
android:layout_below="#+id/chkRememberPassword"
android:layout_alignRight="#+id/chkRememberPassword"
/>
<Button
android:id="#+id/buttonSignIn"
android:text="Log In"
android:layout_width="124px"
android:layout_height="wrap_content"
android:layout_below="#+id/chkRememberPassword"
android:layout_alignLeft="#+id/chkRememberPassword"
/>
</TableRow>
<TextView
android:id="#+id/statusError"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</TableLayout>
</LinearLayout>

I suggest you to use wrap_content in TableLayout & then you can have your buttons in LinearLayout
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>

Its not possible to set more than one layout in a single xml file... And for the same reason Android has layout, layout-landscape, etc. type of folder system..
What you can do is as explained by 100rabh... Make the layout universal by applying relative layout and fill parent settings...
Otherwise as i explained you need to make 2 xml layout files and place the layout for landscape in the layout-landscape folder thereby the respective layout will automatically be set according to the orientation of the phone...
Hope this helps u...

You need to create 2 XML files:
One in the normal layout folder
A second in a res/layout-land to define the layout for the landscape orientation. You'll need to create the res/layout-land folder if it does not already exist.

Related

Android dynamic linear layout containing edit box and spinner

I have below layout i.e 1 spinner and a linear layout containing some edit box's and spinner's.this layout maps/represent to an object (Lets call it X).
The main spinner will be having n number of entries and each entry maps to the layout object (X).So, In all i will need to have n number of layouts
I want to allow user to fill only 1 object at a time ,so, I would keep only 1 layout visible.In order to solve this , One way would be having n number of layouts in .xml and playing with the visibility in onitemselected of the listener.Is there any other better/optiomized way of solving this.
How can i make this dynamic i.e if i dont know the value of n initially ?
`<Spinner
android:id="#+id/linesspinner"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:id="#+id/linView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/linename1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/linecffiltext" />
<Spinner
android:id="#+id/trospinner1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:entries="#array/Tro_arrays"
android:prompt="#string/linetrotext" />
<EditText
android:id="#+id/line1troval"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ems="10" >
</EditText>
<Spinner
android:id="#+id/cfspinner1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:entries="#array/cf_arrays"
android:prompt="#string/linecffiltext" />
<EditText
android:id="#+id/line1cfval"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ems="10" >
</EditText>
</LinearLayout>
try this, put that LinearLayout in another xml and call that xml as many times you want inside loop.
sample xml, name attrib_row.xml
<?xml version="1.0" encoding="utf-8"?>
<Linearlayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/lable"
android:layout_width="150dip"
android:layout_column="0"
android:padding="3dip"
android:textColor="#000033" />
</Linearlayout>
code to call that in loop
Linearlayout row11 = (Linearlayout) LayoutInflater.from(this).inflate(
R.layout.attrib_row, null);
((TextView) row11.findViewById(R.id.lable)).setText("example");

RelativeLayout Stack Buttons

I would like to align two buttons on the bottom of a relative layout that is wrapped inside of a linear layout.
I am unable to get the view favorites button to be on top of the search button. There is a big space as you can see in this image:
Here is my code:
<?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">
<TextView
android:text="#string/SearchRestaurantsCity"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/tvRestaurantSearchCity" />
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/etRestaurantSearchCity" />
<TextView
android:text="#string/SearchRestaurantsState"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/tvRestaurantSearchState" />
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/etRestaurantSearchState" />
<TextView
android:text="#string/SearchRestaurantsCategories"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/tvRestaurantSearchCategories" />
<Spinner
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/spRestaurantSearchCategories" />
<RelativeLayout
android:id="#+id/InnerRelativeLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true">
<Button
android:text="#string/btnViewFavoriteRestaurants"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/btnViewFavoriteRestaurants"
style="#style/ButtonText"
android:padding="5dp"
android:layout_below="btnSearchRestaurants" />
<Button
android:text="#string/btnSearchRestaurants"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/btnSearchRestaurants"
style="#style/ButtonText"
android:layout_alignParentBottom="true"
android:padding="5dp" />
</RelativeLayout>
There are 2 things wrong with the XML.
For starters, you can't refer to the button btnSearchRestaurants before it's defined.
Secondly, you've defined btnSearchRestaurants to align-parent-bottom, and then tried to define that btnViewFavoriteRestaurants would be below that button. It should be above it (as per your description).
If you're trying to put the first button I can see inside RelativeLayout, I'd try to change the following line:
android:layout_below="btnSearchRestaurants" />
for this one:
android:layout_above="#+id/btnSearchRestaurants" />
Part of the space is reserved for all the elements of the layout I can see inside the LinearLayout,and the + is because the button btnSearchRestaurants is below so it is not created yet
I think the problem is at
android:layout_below="btnSearchRestaurants"
It should be
android:layout_below="#id/btnSearchRestaurants"
In your xml code I think you should correct this line
android:layout_below="btnSearchRestaurants"
as you want it to be above the Search Restaurants button it should be
android:layout_above="#id/btnSearchRestaurants"
I changed below to above for obvious reasons (you want it above the other button not below it) and added #id/ because you will be searching for the button id.

How can I align two EditText views when I do not know the amount of text ahead of time for both views?

I have two EditText views whose height I wish to align. The problem is that I cannot predict which view will have more text and hence using android:layout_alignTop and android:layout_alignBottom will not work. The layout I am experimenting with is below. I have already tried android:layout_alignTop and android:layoutAlignBottom but they do not yield satisfactory results.
Layout 1
<?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">
<EditText
android:id="#+id/text1"
android:layout_width="200dip"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:padding="5dip"
android:text="Text 1 bvhg hbjbj kjkbkj kjnjkn hlihj lklkkl"
/>
<EditText
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/text1"
android:padding="5dip"
android:text="Text 2 lasndklsa lkmsclslk klmsldmlk lksdl"
/>
</RelativeLayout>
Figure for Layout 1: http://imgur.com/P6KV7.png
Layout 2 with android:layout_alignTop and android:layout_alignBottom
<?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">
<EditText
android:id="#+id/text1"
android:layout_width="200dip"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignTop="#+id/text2"
android:layout_alignBottom="#+id/text2"
android:padding="5dip"
android:text="Text 1 bvhg hbjbj kjkbkj kjnjkn hlihj lklkkl"
/>
<EditText
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/text1"
android:padding="5dip"
android:text="Text 2 lasndklsa lkmsclslk klmsldmlk lksdl"
/>
</RelativeLayout>
Figure for Layout 2: http://imgur.com/x6fyI.png
But, if I were to change the text on the first EditText then some of the text in that box gets cut-off. See Layout 3 and Figure 3 below:
Layout 3
<?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">
<EditText
android:id="#+id/text1"
android:layout_width="200dip"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignTop="#+id/text2"
android:layout_alignBottom="#+id/text2"
android:padding="5dip"
android:text="Text 1 bvhg hbjbj kjkbkj kjnjkn hlihj lklkkl
1 bvhg hbjbj kjkbkj kjnjkn hlihj lklkkl ncksjcksn
lkslksldcsdc
the end"
/>
<EditText
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/text1"
android:padding="5dip"
android:text="Text 2 lasndklsa lkmsclslk klmsldmlk lksdl"
/>
</RelativeLayout>
Figure 3 for Layout 3 : (Sorry, cannot post more than two hyperlinks because of rep issues.)
Is there a way to align the heights of EditText views when the amount of text in either view is not known ahead of time?
Well, I have to say, this is the first time I've ever found a TableLayout useful. Note the text LOOKS cut off in the preview (as it's really big), but when you compile and run, you'll see that the text is scrollable. The TableView does all the tricky stuff for you. I think this will work for you.
Just realised that you want the textviews to look the same size also - that's easy - give them a transparent background and make the background of the table have the background.
EDIT - One more thing - due to a framework bug, I had to use this:
android:inputType="none"
android:editable="false"
to get the text both scrollable and non-editable. Also, a good point from #mandel - use "fill_parent" not "match_parent" if programming for android devices of an api level less than 8.
<TableLayout
android:id="#+id/tableLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<TableRow
android:layout_height="fill_parent"
android:layout_width="wrap_content"
android:id="#+id/tableRow1"
android:gravity="center_vertical">
<EditText
android:inputType="none"
android:editable="false"
android:text="I have two EditText to align. The problem is that I cannot predict which view will have more tetText to align. The problem is that I cannot predict which view will have more text and hencem I have two EditText views whose height I wish to align. The problem is that I cannot predict which view will have more text and hence"
android:id="#+id/editText1"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent">
</EditText>
<EditText
android:inputType="none"
android:editable="false"
android:text="I have two EditText views whose height I wish to alignhave more text and hence "
android:id="#+id/editText2"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"></EditText>
</TableRow>
</TableLayout>

Issue with Relative/Table Layout

I want the TextView to be always on the top of each EditText, on all of device's screens. First, I've tried to do something with RelativeLayout, but it's not working. Now, I'm trying with TableLayout. I would like your opinion for the best layout for this use!
Here is my code:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="2"
android:background="#drawable/back" >
<TextView android:id="#+id/mathimatika"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Mathimatika Kateuthinsis"
android:textColor="#09074c"
android:textSize="14px"
android:gravity="center" />
<TableRow>
<TextView
android:layout_column="1"
android:text="Profwrika a"
android:padding="13dip"
android:textColor="#09074c"
android:textSize="10px"/>
<TextView
android:text="Profwrika b"
android:gravity="center"
android:textColor="#09074c"
android:textSize="10px" />
<TextView
android:text="grapta"
android:gravity="right"
android:padding="13dip"
android:textColor="#09074c"
android:textSize="10px" />
</TableRow>
<RelativeLayout>
<EditText
android:id="#+id/input11"
android:layout_width="60px"
android:layout_height="wrap_content"
android:textSize="18sp"
android:numeric="decimal|signed"
android:layout_below="#id/vathmos1"
android:layout_marginLeft="13dip" />
<EditText
android:id="#+id/input21"
android:layout_width="60px"
android:layout_height="wrap_content"
android:textSize="18sp"
android:numeric="decimal|signed"
android:layout_toRightOf="#id/input11"
android:layout_below="#id/vathmos1"
android:layout_marginLeft="25px" />
<EditText
android:id="#+id/input31"
android:layout_width="60px"
android:layout_height="wrap_content"
android:textSize="18sp"
android:numeric="decimal|signed"
android:layout_toRightOf="#id/input21"
android:layout_below="#id/vathmos1"
android:layout_marginLeft="25px" />
</RelativeLayout>
</TableLayout>
Well, you can do it with a RelativeLayout, I dont understand why you say you cant do it. But if you want to use it with a TableLayout, then you need to have two TableRow, one with the TextViews and the other with the EditText. Thus, the children of the TableLayout will be the TableRows.
However, I would recommend that you use a RelativeLayout, its cheaper because it doesnt have to calculate stuff and its only one level in the stack.
You can define your three EditText first, then the three TextViews that are above the each EditText, and if you want them to be centered, then you can align both the left and the right side to the EditTexts.
I hope this helps, let me know what you think

How to create column-like layout for ListView rows?

I have a relative layout which looks like this:
Here is the code:
<?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"
>
<TextView
android:id="#+id/nameText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dip"
android:layout_alignParentLeft="true"
android:text="Symbol"
/>
<TextView
android:id="#+id/priceText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dip"
android:layout_toRightOf="#+id/nameText"
android:gravity="right"
android:text="100"
/>
<TextView
android:id="#+id/changeText"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5dip"
android:layout_toRightOf="#+id/priceText"
android:gravity="right"
android:text="1.3"
/>
</RelativeLayout>
How can I get the company name to line up next to the number 1.3?
Following up on Mayra's answer, here's one way to do it using layout_weight:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TableRow>
<TextView
android:id="#+id/left_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left|center_vertical"
android:padding="5dip"
android:layout_weight="0"
android:text="Code"
/>
<TextView
android:id="#+id/middle_text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="right|center_vertical"
android:padding="5dip"
android:layout_weight="1"
android:text="Name of Company"
/>
<TextView
android:id="#+id/right_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dip"
android:gravity="right|center_vertical"
android:layout_weight="0"
android:text="1.3"
/>
</TableRow>
</TableLayout>
It's not clear exactly what you want to have happen, but here are a few options:
If you want columns to be aligned across rows, you might consider using a TableLayout.
You can also use the "weight" atribute to affect what percentage of the screen each TextView takes up. If you assign a value of 1 on the left-most text view, and 0 on the other 2, this will cause the left text view to take up all the extra space, and thus push the middle text view to the right. This will probably cause the middle text view to look right aligned though. You could instead give the left one 20%, the middle one 50% and the right one 30% by assign 2, 5 and 3.
You could also just set an explicit size for the text views (in dpi), but this might be problamatic with different sized screens.
I agree with Mayra! Use the TableView, you'll get the formatting your looking for as well as keep almost all functionality of a ListView (scolling, and list oriented functionality)

Categories

Resources