i've got a layout that looks like below. But ideally I want the buttons Save and Cancel to be 50% width each, next to each other. Can't quite seem to get them to work though.
Any suggestions?
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="match_parent" >
<Button
android:id="#+id/btnMinus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="-" />
<EditText
android:id="#+id/txtCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/btnPlus"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/btnPlus"
android:layout_toRightOf="#+id/btnMinus"
android:ems="10"
android:inputType="number" >
<requestFocus />
</EditText>
<Button
android:id="#+id/btnPlus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="+" />
<Button
android:id="#+id/btnGo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/btnMinus"
android:layout_toRightOf="#+id/button1"
android:maxWidth="100dp"
android:text="Save"
android:width="100dp" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/btnMinus"
android:text="Cancel" />
</RelativeLayout>
You shouldn't be using a RelativeLayout for this design. You should be using a LinearLayout.
Something like this outline (very stripped-down):
<LinearLayout android:orientation=vertical>
<LinearLayout android:orientation=horizontal>
<Button android:layout_width=100 /> <!-- Minus -->
<EditText android:layout_width=0 android:layout_weight=1 />
<Button android:layout_width=100 /> <!-- Plus -->
</LinearLayout>
<LinearLayout android:orientation=horizontal>
<Button android:layout_width=0 android:layout_weight=1 /> <!-- Cancel -->
<Button android:layout_width=0 android:layout_weight=1 /> <!-- Save -->
</LinearLayout>
</LinearLayout>
Your looking for android:layout_weight="0.5". This only works with LinearLayouts, though.
So what you could do is add a LinearLayout that contains your two buttons and set the weights then.
You should use a LinearLayout, inside the RelativeLayout, only for buttons, and give them the same android:layout_weight (1 and 1, 2 and 2, as you wish).
Related
I have a lot of info to put on one xml page. Now i got what I want in the positions i want. However instead of fitting all my data on 3 key parts without running into each other, It keeps running into the next TextView. I was wondering how to have it auto adjust.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<Button
android:id="#+id/back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:text="#string/back" />
<TextView
android:id="#+id/makeup_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/info_title"
android:layout_marginTop="97dp"
android:text="#string/part_section_2" />
<TextView
android:id="#+id/part_info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/info_title"
android:layout_marginLeft="19dp"
android:layout_marginTop="38dp"
android:text="put text here for info" />
<TextView
android:id="#+id/part_safety"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/part_makeup"
android:layout_below="#+id/safety_title"
android:layout_marginTop="28dp"
android:text="put text here for safety" />
<TextView
android:id="#+id/info_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="42dp"
android:text="#string/part_section_1" />
<TextView
android:id="#+id/part_makeup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/part_info"
android:layout_below="#+id/makeup_title"
android:layout_marginTop="33dp"
android:text="put text here for makeup" />
<TextView
android:id="#+id/safety_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/part_makeup"
android:layout_marginTop="48dp"
android:text="#string/part_section_3" />
<TextView
android:id="#+id/part_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="16dp"
android:textColor="#b70000"
android:textSize="16sp"
android:text="put text here for part title" />
</RelativeLayout>
would ScrollView work better? and how would switch this from this to ScrollView.
skin is 480x800
density is high(240)
Strings file - http://pastie.org/8534713
Changing to ScrollView (source):
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- your Button and TextView widgets -->
</RelativeLayout>
</ScrollView>
Edit:
As well as that, try changing your back button XML to this:
<Button
android:id="#+id/back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/part_safety"
android:layout_centerHorizontal="true"
android:layout_marginTop="50dp"
android:text="#string/back" />
The problem was android:layout_alignParentBottom="true". The bottom ended up not going to the bottom of the page like you had before. The ScrollView cut back on the bottom of the layout.
I have screen with 18 buttons, Is it possible to make this group of buttons scrollable so that user can see buttons which are out of the viewable area. I tried putting these buttons in ScrollView but got the exception that only their can be only 1 child of scroll view.
Currently the buttons are present in a RelativeLayout like:
<Button
android:id="#+id/btnChapter2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/btnChapter1"
android:layout_below="#+id/btnChapter1"
android:text="Chapter 2" />
<Button
android:id="#+id/btnChapter3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/btnChapter2"
android:layout_below="#+id/btnChapter2"
android:text="Chapter 3" />
<Button
android:id="#+id/btnChapter4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/btnChapter3"
android:layout_below="#+id/btnChapter3"
android:text="Chapter 4" />
<Button
android:id="#+id/btnChapter5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/btnChapter4"
android:layout_below="#+id/btnChapter4"
android:text="Chapter 5" />
<Button
android:id="#+id/btnChapter6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/btnChapter5"
android:layout_below="#+id/btnChapter5"
android:text="Chapter 6" />
The current screen with buttons 9, 17 and 18 being screwed up looks as:
Well, ScrollView may have only one child. In this case, put a LinearLayout or RelativeLayout as the ScrollView's child. The put your button inside the LinearLayout or RelativeLayout. That should've done it. Example code:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
</ScrollView>
I am trying to display a single list item after the user clicks on an item. However, I have noticed that the layout is messed up when there is too much text. Sometimes it's pushed half way, sometimes it's completely to the right side of the screen. I don't understand why this is happening. How can I resolve this issue? Please note I have the exact same layout in a popup dialog with no problems.
This is my XML code:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TableLayout
android:id="#+id/add_spot_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:shrinkColumns="1"
android:stretchColumns="1" >
<TableRow
android:layout_marginBottom="1sp"
android:layout_marginTop="2sp" >
<TextView
android:id="#+id/nameDetails"
android:layout_width="fill_parent"
android:textSize="25sp"
android:textStyle="bold" />
</TableRow>
<!-- separator -->
<View
android:layout_width="fill_parent"
android:layout_height="1dp"
android:background="#android:color/darker_gray" />
<TableRow
android:layout_marginBottom="2sp"
android:layout_marginTop="2sp" >
<TextView
android:layout_marginLeft="5sp"
android:text="#string/distance"
/>
<TextView android:id="#+id/distanceDetails" />
</TableRow>
<TableRow
android:layout_marginBottom="2sp"
android:layout_marginTop="2sp" >
<TextView
android:layout_marginLeft="5sp"
android:text="#string/address"
/>
<TextView android:id="#+id/addrDetails" />
</TableRow>
<TableRow
android:layout_marginBottom="2sp"
android:layout_marginTop="2sp" >
<TextView
android:layout_marginLeft="5sp"
android:text="#string/type"
/>
<TextView android:id="#+id/typeDetails" />
</TableRow>
<TableRow
android:layout_marginBottom="2sp"
android:layout_marginTop="2sp" >
<TextView
android:layout_marginLeft="5sp"
android:text="#string/terrain" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RatingBar
android:id="#+id/terrainDetails"
style="?android:attr/ratingBarStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:isIndicator="true"
android:max="5"
android:numStars="5"
android:stepSize="1" />
</RelativeLayout>
</TableRow>
<TableRow>
<TextView
android:layout_marginLeft="5sp"
android:text="#string/difficulty" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RatingBar
android:id="#+id/difficultyDetails"
style="?android:attr/ratingBarStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:isIndicator="true"
android:max="5"
android:numStars="5"
android:stepSize="0.1" />
</RelativeLayout>
</TableRow>
<TableRow
android:layout_marginBottom="2sp"
android:layout_marginTop="2sp" >
<TextView
android:layout_marginLeft="5sp"
android:text="#string/description" />
<TextView
android:id="#+id/descDetails"
android:gravity="top"
android:lines="2"
android:maxLines="2"
android:scrollHorizontally="false" />
</TableRow>
<View
android:layout_width="fill_parent"
android:layout_height="1dp"
android:background="#android:color/darker_gray" />
</TableLayout>
</ScrollView>
Here are some screenshots to show you what I mean:
What it should be:
What it shouldn't be:
Pushed to the right side of the screen
Too much text in description. Goes off the screen
Pushed only half way.
The size of a column in a TableLayout is given by its largest content.
The way you organized your layout, the title nameDetails is in the first column.
You'll notice that, in the cases you don't like, the second column is neatly aligned with the end of your title.
To solve this, either move the title out of the table layout, or use the android:layout_span attribute to span it on 2 columns
I believe this is happening because you have your title #+id/nameDetails as the first row of the table. It is including the length of this <textview> cell when it determines the size of the left hand side of the table.
Can you move that textview out of the tableview?
I am working on a Android Project in which I need to design a User Interface like below image-
I need to show some text on top as Student App, then below that there will be different objects of a Student. Suppose if I have 10 Students then there will be 10 rows for each student. And in each row there will be image on left hand side, then in the middle some text will be there and then on the right hand side there will be another three text.
I made some progress and I have below code. But it's not exact the way I am looking for in the image.
<ImageView
android:id="#+id/icon"
android:src="#drawable/action_eating"
android:layout_width="60dp"
android:layout_height="60dp" />
<LinearLayout
android:orientation="vertical"
android:layout_gravity="center_vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp" >
<TextView
android:id="#+id/text1"
android:text="test"
android:textColor="#333"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp" />
<TextView
android:id="#+id/text2"
android:text="test2"
android:textColor="#6699CC"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14sp" />
</LinearLayout>
And I need to make that list scrollable.
Can anyone help me out with this? Thanks for the help.
Using Table view how you can create column
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tableLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<!-- 2 columns -->
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dip" >
<TextView
android:id="#+id/textView1"
android:text="Column 1"
android:textAppearance="?android:attr/textAppearanceLarge" />
<Button
android:id="#+id/button1"
android:text="Column 2" />
</TableRow>
<!-- edittext span 2 column -->
<TableRow
android:id="#+id/tableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dip" >
<EditText
android:id="#+id/editText1"
android:layout_span="2"
android:text="Column 1 & 2" />
</TableRow>
<!-- just draw a red line -->
<View
android:layout_height="2dip"
android:background="#FF0000" />
<!-- 3 columns -->
<TableRow
android:id="#+id/tableRow3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dip" >
<TextView
android:id="#+id/textView2"
android:text="Column 1"
android:textAppearance="?android:attr/textAppearanceLarge" />
<Button
android:id="#+id/button2"
android:text="Column 2" />
<Button
android:id="#+id/button3"
android:text="Column 3" />
</TableRow>
<!-- display this button in 3rd column via layout_column(zero based) -->
<TableRow
android:id="#+id/tableRow4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dip" >
<Button
android:id="#+id/button4"
android:layout_column="2"
android:text="Column 3" />
</TableRow>
<!-- display this button in 2nd column via layout_column(zero based) -->
<TableRow
android:id="#+id/tableRow5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dip" >
<Button
android:id="#+id/button5"
android:layout_column="1"
android:text="Column 2" />
</TableRow>
</TableLayout>
You need a ListView for your students list, and create a custom class that derives from ArrayAdapter<Student> and override getView(). The list of student objects gets passed to the adapter and the adapter gets passed to the ListView. If you're doing this for a class and your intention is to learn, this is great stuff to get familiar with and is very practical for professional Android development. For extra credit, find a video on YouTube called "World of ListView" from Google I/O 2012 and make your lists faster than the rest of your classmates.
I've added a couple small relative layouts to the main layout of an activity using "Include Other Layout" in the graphical editor. However, for some reason when I try to load the activity in the emulator, it fails. There are no warnings other than a bunch of generic stuff in LogCat that looks exactly the same as any other time I have an error. In the .Java file for this activity, I've successfully made reference to the views within these included layouts without any problems.
This are the elements from the activity's .xml file that include the layouts.
<include
android:id="#+id/include1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/lblParklandAssistDesc"
android:layout_below="#+id/lblParklandAssistDesc"
layout="#layout/parklandweight" />
<include
android:id="#+id/include2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/include1"
android:layout_below="#+id/include1"
layout="#layout/parklandbsa" />
And these are the layouts that are included
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<Button
android:id="#+id/btnWeightUp"
style="?android:attr/buttonStyleSmall"
android:layout_width="55dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="#string/Up" />
<Button
android:id="#+id/brnWeightDown"
style="?android:attr/buttonStyleSmall"
android:layout_width="55dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/btnWeightUp"
android:text="#string/Down" />
<TextView
android:id="#+id/lblParklandWeightTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/btnWeightUp"
android:text="#string/lblWeight"
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/txtWeight"
android:layout_width="55dp"
android:layout_height="wrap_content"
android:layout_below="#+id/lblParklandWeightTitle"
android:layout_toRightOf="#+id/btnWeightUp"
android:ems="10"
android:inputType="number"
android:text="100" >
<requestFocus />
</EditText>
<RadioGroup
android:id="#+id/radioGroup1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/lblParklandWeightTitle" >
<RadioButton
android:id="#+id/radio0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:checked="true"
android:text="#string/lb" />
<RadioButton
android:id="#+id/radio1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/kg" />
</RadioGroup>
</RelativeLayout>
Then the other one.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<Button
android:id="#+id/btnBSADown"
style="?android:attr/buttonStyleSmall"
android:layout_width="55dp"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/btnBSAUp"
android:layout_below="#+id/btnBSAUp"
android:text="#string/Down" />
<TextView
android:id="#+id/lblParklandBSAtitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="58dp"
android:text="#string/lblParklandBSAtitle"
android:textAppearance="?android:attr/textAppearanceLarge" />
<Button
android:id="#+id/btnBSAUp"
style="?android:attr/buttonStyleSmall"
android:layout_width="55dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="#string/Up" />
<EditText
android:id="#+id/txtBSA"
android:layout_width="55dp"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/lblParklandBSAtitle"
android:layout_below="#+id/lblParklandBSAtitle"
android:ems="10"
android:inputType="number"
android:text="3" />
</RelativeLayout>
I don't have the foggiest idea as to what could be going on or frankly even where to look. I've been working with eclipse and java with android for almost two weeks, have made one app, and have been having great luck and easy learning with everything. This has left me stumped. Any help would be greatly appreciated!
New Addition(added .Java Content because it seems that the xml layouts themselves may not be the problem):
In the top of the activity's class I declare the variables that will handle the other layouts like this:
View parklandWeight;
View parklandBSA;
Then, when I assign the object to it - I do so like this:
parklandWeight = (View) findViewById(R.layout.parklandweight);
parklandBSA = (View) findViewById(R.layout.parklandbsa);
The only error that appears to be from this activity.java in the LogCat occurs just after this second assignment. On another assignment that refers a button inside one of these layouts:
btnWeightUp = (Button) parklandWeight.findViewById(R.id.btnWeightUp);
Could this be the root of my issue? I've read at least five or six different threads here in StackOverflow where this is what is advised to do. Thanks in advance.
I have tried these code runs perfect... Try these.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:ignore="HardCodedText" >
<include
android:id="#+id/include2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/include1"
android:layout_alignParentTop="true"
android:layout_below="#+id/include1"
layout="#layout/top" />
<Button
android:id="#+id/btnWeightUp"
style="?android:attr/buttonStyleSmall"
android:layout_width="55dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/include2"
android:text="Up" />
<Button
android:id="#+id/brnWeightDown"
style="?android:attr/buttonStyleSmall"
android:layout_width="55dp"
android:layout_height="wrap_content"
android:layout_below="#+id/btnWeightUp"
android:text="Down" />
<TextView
android:id="#+id/lblParklandWeightTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/include2"
android:layout_toRightOf="#+id/btnWeightUp"
android:text="lblWeight"
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/txtWeight"
android:layout_width="55dp"
android:layout_height="wrap_content"
android:layout_below="#+id/lblParklandWeightTitle"
android:layout_toRightOf="#+id/btnWeightUp"
android:ems="10"
android:inputType="number"
android:text="100" >
<requestFocus />
</EditText>
<RadioGroup
android:id="#+id/radioGroup1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/include2"
android:layout_toRightOf="#+id/lblParklandWeightTitle" >
<RadioButton
android:id="#+id/radio0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:checked="true"
android:text="lb" />
<RadioButton
android:id="#+id/radio1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="kg" />
</RadioGroup>
</RelativeLayout>
I was typing the variables for the layouts wrong. Instead of using
View layoutVariable;
I needed to be typing by the actual layout type as below.
RelativeLayout parklandWeight;
RelativeLayout parklandBSA;
Then, when assigning the actual layout object to the variable, I should have been typing it as the layout type, of course. But, more than that, in the findViewById method I was using R.layout.layout_id when I should have been using R.id.layout_id. I was also referring to the xml file name where I should have been referring to the same +id that is used in the include tag in the xml file.
This is the way I should have been doing it:
parklandWeight = (RelativeLayout) findViewById(R.id.include1);
parklandBSA = (RelativeLayout) findViewById(R.id.include2);
I hope this helps any newcomers to android development who run into the same problem. I hope you all have an incredible day!