The header I'm looking for would look something like this:
Just need something to stay to the left, stay in the center, and stay to the right. Everything I have tried has had the center moved over a little towards the right so it looks off center. Any ideas or suggesstions?
EDIT:
This seems to be the closest I've been able to do with a simple amount of code
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#000"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/LinearLayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#000"
android:orientation="horizontal" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_weight="1"
android:text="First"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#fff" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:text="Second"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#fff" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_weight="1"
android:text="3"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#fff" />
</LinearLayout>
</LinearLayout>
Thanks in advance
I'll tell you how to do this. Set up a horizontal LinearLayout with layout_width of fill_parent and layout_height of wrap_content and weightSum of, in your case, 3. Fill it with three TextViews with layout_width set to fill_parent, layout_height set to wrap_content and layout_weight set to 1. Then the first TextView's gravity to "left", second one's to "center" and the third one's to "right". Done.
Related
I have a relative layout, and inside it i place 3 items, 2 imageviews and one scrollview.
My layout is like this...
<?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:layout_gravity="center"
android:gravity="center"
android:orientation="horizontal"
android:baselineAligned="true"
android:background="#drawable/background">
<RelativeLayout
android:id="#+id/logosLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_weight="1"
android:layout_margin="16dp"
android:gravity="center">
<!-- An image will be placed here -->
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_weight="1"
android:background="#33ffffff"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:src="#drawable/up" />
<ScrollView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="8dp"
android:fadingEdgeLength="32dp"
android:scrollbars="none" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical" >
<ImageButton
android:id="#+id/hotelBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:background="#drawable/button_background"
android:contentDescription="#string/hotelBtnDesc"
android:gravity="center"
android:src="#drawable/icon1" />
<TextView
android:id="#+id/hotelBtnDescTxtVw"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:gravity="center"
android:text="#string/hotelBtnDesc"
android:textColor="#ffffff"
android:textSize="14sp" />
<!-- more scrollview items -->
</LinearLayout>
</ScrollView>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:src="#drawable/down" />
</RelativeLayout>
</LinearLayout>
The above code produces the view shown here:
You may note that the arrows are not aligned in the center, but are slightly moved to the right. Why is that, and how can I fix it ? Note that i have already used android:layout_centerHorizontal="true" to my imageviews.
Thank you in advance
Its problem with your
android:layout_margin="8dp"
remove it from both scrollview and imageView
and pass it to RelativeLayout direct.
or add
android:layout_marginTop="8dip"
android:layout_marginBottom="8dip"
in your RelativeLayout.
and pass
android:layout_centerHorizontal="true"
to your scrollview
they are aligned to the center if you put the marginRight into consideration, try adding android:layout_margin="8dp" to the arrows.
u need to set image view that is under the Relative layout set this image view width fill parent.
Try removing android:layout_weight="1" from your RelativeLayout and see if it works.
In your LinearLayout, the attribute android:orientation="horizontal" causing your display to be aligned horizontaly. Therefore your RelativeLayout is in center but since its shared with another layout thats why you cant note the difference. If you completely remove the first RelativeLayout (the one with id logosLayout) then i hope you'll see the second layout in center.
So, first you need to define the hierarchy of layout you require and then adjust your views accordingly.
It seems problem with your android:layout_margin="8dp" for your scrollview only and pass it to RelativeLayout direct but instead of using margin use padding = "8dp".
In my LinearLayout the use of weight in Combination with Gravity causes to reverse the effect of weight. The Layout:
<LinearLayout android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content"
android:layout_weight="0.2">
<TextView android:id="#+id/feedfragmentTitle" android:layout_height="wrap_content" android:layout_width="fill_parent" android:layout_weight="8"/>
<TextView android:id="#+id/feedfragmentDate" android:layout_height="wrap_content" android:gravity="right" android:layout_width="fill_parent" android:layout_weight="2"/>
</LinearLayout>
The given LinearLayout contains a Title, which should appromately take 80% of the Layout and an Date+Time with 20%. The Date+Time should have the Gravity of right. The layout i posted doesnt work unfortunately and if i play with the parameters weight, the result is the inversed one.
Is there another way to get the Results without swapping the weights ?
When you use the layout_weight property you need to make the appropriate height or width as 0dip
try this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView android:id="#+id/feedfragmentTitle"
android:layout_height="wrap_content" android:layout_width="0dip"
android:layout_weight="8" android:text="sdfdfsfsd"/>
<TextView android:text="aass" android:id="#+id/feedfragmentDate"
android:layout_height="wrap_content"
android:gravity="right" android:layout_width="0dip"
android:layout_weight="2"/>
</LinearLayout>
Try like this
<LinearLayout android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content">
<TextView android:id="#+id/feedfragmentTitle" android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_gravity="left"/>
<TextView android:id="#+id/feedfragmentDate" android:layout_height="wrap_content" android:layout_gravity="right" android:layout_width="wrap_content" />
</LinearLayout>
The layout definition is below. Basically I want the two buttons to be the same width, but right now their width is determined by the string they display, is there a better way to lay this out such that the buttons are the same width and that the Button+EditText combo fills the width of the screen?
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/editorlinearlayout"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center">
<LinearLayout android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button android:id="#+id/setNameBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Set Item Name "/>
<EditText android:id="#+id/nameTxtBox"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
<LinearLayout android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button android:id="#+id/setGroupBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Set Group Name"/>
<EditText android:id="#+id/groupTxtBox"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>
Edit:
I've tried using a TableLayout as was suggested below, but now the EditText's don't fill the remaining portion of the screen. See the image and layout below.
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TableRow>
<Button android:id="#+id/setNameBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Set Item Name "/>
<EditText android:id="#+id/nameTxtBox"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</TableRow>
<TableRow>
<Button android:id="#+id/setGroupBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Set Group Name"/>
<EditText android:id="#+id/groupTxtBox"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</TableRow>
</TableLayout>
the trick is to combine the tableview defined in the edit above with a strechColumn tag:
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:stretchColumns="1">
<TableRow>
<Button android:id="#+id/setNameBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Set Item Name "/>
<EditText android:id="#+id/nameTxtBox"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</TableRow>
</TableLayout>
Use a TableLayout and TableRows.
Three options:
Put this in a TableLayout instead of the nested LinearLayout thing you are currently doing
Change your nesting from a vertical parent with horizontal children to a horizontal parent with vertical children (however, this opens up possible vertical positioning issues, so I don't favor this option)
Use a RelativeLayout and all of the layout_* attributes that RelativeLayout children have available to them
I'd favor option 1, personally.
you can use specific width and height for laout_width/layout_height, as in layout_width="150dip". You run the risk of having a button that can't fit all your text though, but if your text is fixed, you can double check to make sure it's all good.
<?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="Title"
android:id="#+id/TextView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="30px"
android:textStyle="bold"
>
</TextView>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="60px">
<Button
android:text="Choose a Story"
android:id="#+id/choose"
android:layout_width="150px"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="1px">
</Button>
<Button
android:text="Info"
android:id="#+id/info"
android:layout_width="150px"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="1px">
</Button>
</LinearLayout>
</LinearLayout>
In this code, as you can see, there is a title, 2 linear layouts, and 2 buttons that are inside a linear layout. What I'm trying to do is center the 2 buttons. No matter what I do, I can never get the 2 buttons to be centered at the bottom with a height of 60px.
In the end I'm trying to make the text centered both vertically and horizontally, and have the 2 buttons on the bottom centered horizontally. What do I need to change?
Heres a picture of what it looks like in the Layout Editor.
On your inner linear layout, set the layout_gravity.
Here's one solution
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:text="Title"
android:id="#+id/TextView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="30dip"
android:textStyle="bold"
/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="60dip"
android:layout_gravity="bottom|center_horizontal"
android:layout_marginBottom="1dip"
>
<Button
android:text="Choose a Story"
android:id="#+id/choose"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
<Button
android:text="Info"
android:id="#+id/info"
android:layout_width="0dip"
android:layout_weight="1"
android:layout_height="wrap_content"
/>
</LinearLayout>
</FrameLayout>
In general, you should style the outermost component (container) which will then position all of its children accordingly. As a side not, this layout would be achieved using just a single (or pair, depending on exactly what you're trying to do) or FrameLayouts, which would significantly reduce the layout overhead. While there's nothing wrong with LinearLayout, it is surprisingly computationally expensive.
I'm just beginning Android and have gotten myself stuck. I've made a simple app/view. The idea is draw a line-maze in the top, with motion buttons on the bottom. My app only draws an x with a couple lines in the frame, but that works. The problem is that my buttons are being drawn too far down, and are clipped in height.
I assume the problem is all in my layout xml:
<?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">
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" >
<none.maze.MazeView
android:id="#+id/maze"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:id="#+id/text"
android:text="#string/maze_layout_text_text"
android:visibility="visible"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:textColor="#ff8888ff"
android:textSize="24sp"/>
</RelativeLayout>
</FrameLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1" >
<Button
android:id="#+id/left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Left"
android:layout_weight="1"
/>
<Button
android:id="#+id/forward"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Forward"
android:layout_weight="1"
/>
<Button
android:id="#+id/right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Right"
android:layout_weight="1"
/>
</LinearLayout>
</LinearLayout>
I think you shouldn't use layout_height="fill_parent" and layout_weight at the same time. Try to set layout_height="0dip" and layout_weight="1" for the FrameLayout and layout_height="wrap_content" for the lower LinearLayout. The lower LinearLayout mustn't have the layout_weight attribute.
Use Hierarchy Viewer to debug your layout. Its pretty cool.
Your entire layout is just way too bloated and ineffective. You use way too many ViewGroups. I recommend reading about RelativeLayouts and especially the entire Layout Tricks series.