How to change buttons layout from horizontal to vertical? - android

I'm translating a chinese app and I want to change the bottom buttons layout from horizontal to vertical in order to fit correctly the translations. I've been playing with the orientation and gravity from the LinearLayout and CheckedTextView but the buttons stay always in horizontal.
This is the xml code,
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:orientation="vertical"
android:background="#drawable/homepage_ground" android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:nav_stick="http://schemas.android.com/apk/res-auto">
<include layout="#layout/title_bar_transparent_white" />
<RelativeLayout android:layout_width="fill_parent" android:layout_height="0.0px" android:layout_weight="1.0">
<com.rockrobo.ui.RRNavigateStick android:id="#id/navigate_stick" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" />
<TextView android:id="#id/rc_starting" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="10.0dip" android:text="#string/rc_starting_up" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" />
</RelativeLayout>
<LinearLayout android:layout_gravity="center" android:orientation="horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginBottom="#dimen/rc_bot_margin">
<CheckedTextView android:textColor="#color/rc_button_text_color" android:gravity="center" android:id="#id/spot_clean" android:background="#drawable/rc_button_bg" android:clickable="true" android:layout_width="#dimen/rc_button_width" android:layout_height="#dimen/rc_button_height" android:layout_marginRight="#dimen/rc_bot_bar_gap" android:text="#string/rr_spot" />
<CheckedTextView android:textColor="#color/rc_button_text_color" android:gravity="center" android:id="#id/clean" android:background="#drawable/rc_button_bg" android:clickable="true" android:layout_width="#dimen/rc_button_width" android:layout_height="#dimen/rc_button_height" android:layout_marginRight="#dimen/rc_bot_bar_gap" android:text="#string/rr_clean" />
<CheckedTextView android:textColor="#color/rc_button_text_color" android:gravity="center" android:id="#id/charge" android:background="#drawable/rc_button_bg" android:clickable="true" android:layout_width="#dimen/rc_button_width" android:layout_height="#dimen/rc_button_height" android:text="#string/rr_charge" />
</LinearLayout>
Could anybody help? Thanks.

Hi try changing linear layout width to match parent and orientation to vertical

Related

Align a layout on top, inside other layout

I have 2 fragments, the first had the second inside it. This is the first:
<?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:background="#drawable/gradient_details_bg"
android:orientation="vertical" >
<TextView
android:id="#+id/fragmentDetailTitle"
style="#style/textTitleDetailStyle" />
<LinearLayout
android:id="#+id/detailSubObjectFrame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center"
android:orientation="vertical" >
</LinearLayout>
<Button
android:id="#+id/fragmentDetailButtonGo"
style="#style/goButtonStyle" />
</RelativeLayout>
And inside the layout detailSubObjectFrame I had others fragments. In this specific case:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/sub_take_error_Layout"
android:layout_width="wrap_content"
android:layout_height="match_parent"
>
<LinearLayout
android:id="#+id/numberErrorLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center"
android:orientation="horizontal" >
<com.mypackage.NumberPickerCustom
android:id="#+id/numberPickerCustomRandom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
max="100"
min="1"
value="30" />
<TextView
android:id="#+id/moreText"
style="#style/textOnSubmenu"
android:textSize="20sp"
android:text="#string/moreErrorText" />
</LinearLayout>
<LinearLayout
android:id="#+id/myLayoutTop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:orientation="horizontal" >
<TextView
android:id="#+id/numberOfQuestion"
style="#style/textOnSubmenu"
android:textSize="20sp"
android:text="#string/numberOfErrorQuestionText" />
<TextView
android:id="#+id/numberOfQuestionValue"
style="#style/textOnSubmenu"
android:textSize="20sp"
android:text="6" />
</LinearLayout>
</RelativeLayout>
I would like that the layout "myLayoutTop", will be placed just below the textview of the first fragment fragmentDetailTitle. (Without moving the other layout from the center).
Like you can see I tried layout_alignParentTop but didn't work.
If needed I could totally change only the layout of the 2nd fragment, the constraint that I have is that numberErrorLayout should stay (like now) on the center of the screen.
I just changed the layout of detailSubObjectFrame in a FrameLayout and sub_take_error_Layout in a LinearLayout. After I used the attribute gravity for numberErrorLayout and myLayoutTop.

How to set width of TextView for fill HorizontalScrollView?

I need a TextView that the user can scroll horizontally with his finger. I create HorizontalScrollView and add TextView. But I can not set the width of TextView, so that it fills completely HorizontalTextView. How can this be achieved?
Thanks!
layout .xml code:
<?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" >
<ImageButton
android:id="#+id/btnBackspace"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:src="#drawable/buttonface_backspace" />
<HorizontalScrollView
android:id="#+id/horizontalScrollView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/btnBackspace"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/btnBackspace" >
<TextView
android:id="#+id/calculatedField"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:textSize="75sp" />
</HorizontalScrollView>
</RelativeLayout>

Center list item vertically on ListView

I'm developing an Android application.
On one activity I have a List with list items. Those list items will have a TextView (I'm using my own layout because probably I will need to add more widgets to it).
This is ListActivity xml:
<?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" >
<ListView
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="469dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="40dp">
</ListView>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/orderErrorMsg"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:textSize="16dp" >
</TextView>
</RelativeLayout>
</LinearLayout>
And this is ListItem xml:
<?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="100dp"
android:orientation="vertical">
<TextView
android:id="#+id/orderToFillName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:textSize="20dp" />
</LinearLayout>
And, finally, this is the result:
Why TextView is not centered vertically?
You have "wrap_content" on the layout_height of the TextView = there is no space to center vertically on since the TextView is wrapped tightly.
Try changing the layout_height to "match_parent" or place gravity="center_vertical" attribute in the LinearLayout instead.
<TextView
android:id="#+id/orderToFillName"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:textSize="20dp" />
the answer is really simple: you have to add this to your TextView's XML:
android:gravity="center"
Currently you're not setting the text's position in the TextView but just the View's position.
Best wishes,
Tim
Try this way:
<TextView
android:id="#+id/orderToFillName"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity= "center_vertical|center_horizontal"
android:textSize="20dp" />
or
android:gravity="center"

Android: Layout List header

I have a header for a list that contains two image buttons. I want one of those image buttons to be on the left, and the other to be on the right. This is what my xml file looks like right now but it does not work, it just puts the two image buttons on the left together. I have also tried without the additional LinearLayouts but no luck.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:gravity="fill_horizontal"
android:background="#drawable/list_header_background">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:gravity="left"
android:background="#drawable/list_header_background">
<ImageButton
android:id="#+id/refreshBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:src="#drawable/ic_refresh"
android:background="#drawable/list_header_background"
/>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:gravity="right"
android:background="#drawable/list_header_background">
<ImageButton
android:id="#+id/battleBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:src="#drawable/ic_battle"
android:background="#drawable/list_header_background"
/>
</LinearLayout>
</LinearLayout>
As kabuko wrote, the RelativeLayout width is equal to the parent width. When we have a child view inside that RelativeLayout, we can use the android:layout_alignParentXXXXXX="true" parameter in order to align it (the child) accordingly to the parent.
<?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:orientation="horizontal"
android:background="#drawable/list_header_background">
<ImageButton
android:id="#+id/refreshBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:src="#drawable/ic_refresh"
android:layout_alignParentLeft="true"
android:background="#drawable/list_header_background"
/>
<ImageButton
android:id="#+id/battleBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="4dp"
android:src="#drawable/ic_battle"
android:layout_alignParentRight="true"
android:background="#drawable/list_header_background"
/>
</RelativeLayout>
You probably want to use a RelativeLayout with layout_alignParentLeft and layout_alignParentRight on the buttons.

Relative Layout, Textview not showing

I am using this XML to show my one Button at the bottom and one TextView at the top with one TextView right in the middle. The middle textview covers the whole span in between the button and the top textview. The middle TextView is not being displayed at all. What is wrong?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_alignParentBottom="true"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_above="#id/task"
android:layout_below="#id/btnAddTask"
/>
</RelativeLayout>
Your problem is definitely that you have the TasksList TextView below your button. Swap your layout_above and layout_below values. This works for me:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_alignParentBottom="true"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_above="#id/btnAddTask"
android:layout_below="#id/task"
/>
</RelativeLayout>
The problem wsa that you reversed your layout above and the layout below:
try
android:layout_below="#id/task"
android:layout_above="#id/btnAddTask"
See screenshot.
And here is the complete layout.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_alignParentBottom="true"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_below="#id/task"
android:layout_above="#id/btnAddTask"
/>
</RelativeLayout>
There's definitely something wrong with how you have this laid out.
You have for the button, alignParentBottom="true"... then for the TasksList TextView it is set to be below the button... basically off the screen.
You can remove orientation from the RelativeLayout... Relative layout's do not have orientation like LinearLayout's do.
As you're describing... I'm not 100% you can do it with a Relative Layout. If you simply wanted one thing on top, one centered and the other on bottom, it would be best to use a single layout parameter for each one, centerInParent, alignParentTop and alignParentBottom.
If you reconsider LinearLayout (as I'm guessing you started with) you'd stick with a Vertical Orientation, then give them layout_weight of 0, 1, and 0 making sure the height was set to wrap_content.
<?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:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_weight="1"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_weight="0"
/>
</LinearLayout>

Categories

Resources