How can I align image vertical center in a Linear Layout - android

I have the following layout, which is 1 icon on the left and 2 text views (stack on top of each other) on the right. I would like to have the text1 vertically center in the panel and when I make the text2 Visible.GONE. Can you please tell me how can i do that?
<RelativeLayout android:id="#+id/panel"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight">
<ImageView
android:id="#+id/icon1"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical"/>
<TextView android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/icon1"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_gravity="center_vertical"/>
<TextView android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/icon1"
android:layout_below="#id/text1"
android:textAppearance="?android:attr/textAppearanceSmall"/>
</RelativeLayout>

All you have to do is, in your first example, to replace android:gravity on the ImageView by android:layout_gravity.
That's all :)

I'd change it to one relative layout with only three views inside. And you can use android:layout_centerHorizontal, android:layout_centerVertical to align stuff as well.

Related

Android - Centre Text Relative to Screen and not View

I have a number of textviews in a linear layout, which itself is sitting within a linear layout within a relative layout (see structure below). I am positioning the top level linear layout to the right of a button in the view by using android:layout_toRightOf to stop the textview overlapping the button when the text is too long.
What I want to do is centre the text in the textviews relative to the entire view, not the linear layout within which it sits (i.e centre it relative to the screen width). I have tried using layout_gravity set to centre in the textview and the relative layout) but with no effect.
Can anyone suggest how to centre the text in this way ?
<RelativeLayout
android:id="#+id/headerLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#drawable/purple"
android:minHeight="64dip"
android:visibility="visible" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="2dip"
android:layout_toRightOf="#+id/backButton"
android:gravity="center|center_vertical|fill_vertical"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/headerTextLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="48dip"
android:layout_marginRight="48dip"
android:gravity="center|center_vertical|fill_vertical"
android:orientation="vertical" >
<TextView
android:id="#+id/headerText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text=""
android:textColor="#color/white_color"
android:textSize="18sp"
android:paddingLeft="16dip"
android:paddingRight="16dip"
android:typeface="sans"
android:singleLine="true"/>
Try this
<TextView
android:id="#+id/headerText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text=""
**android:textAlignment="gravity"**
android:textColor="#color/white_color"
android:textSize="18sp"
android:paddingLeft="16dip"
android:paddingRight="16dip"
android:typeface="sans"
android:singleLine="true"/>

Multiple alignments textview android

What I want to do is have one word aligned on the far left side of a textview and one word aligned on the far right of the same textview. I have no idea how to do this. I'm using android studio. Whats the best, if not the only way to do this? Thanks.
use RelativeLayout,
RelativeLayout is a view group that displays child views in relative positions. The position of each view can be specified as relative to sibling elements (such as to the left-of or below another view) or in positions relative to the parent RelativeLayout area (such as aligned to the bottom, left or center).
Here you have two textview tv_1 at the most left and tv_2 at the most right (layout_alignParentRight="true"), and the tv_2 will follow tv_1 do to layout_alignBottom="#+id/tv_1"
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/tv_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="left"
android:layout_centerVertical="true"/>
<TextView
android:id="#+id/tv_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="right"
android:layout_alignParentRight="true"
android:layout_alignBottom="#+id/tv_1"/> </RelativeLayout>
It would be very hard to do that(Auto spacing between two words in a single TextView). Using 2 TextView is suggestive
Replace your TextView with this
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:layout_weight="1"
android:text="TextView" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:gravity="right"
android:layout_weight="1"/>
</LinearLayout>

Unable to horizontally center a TextView

I have a TextView inside a LinearLayout and i want to align it in center of the page but its not happening, i have tried the following:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<TextView
android:id="#+id/userName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:background="#80000000"
android:gravity="center"
android:padding="10dp"
android:text="User Name"
android:textColor="#FFFFFF"
android:textSize="12sp" />
</LinearLayout>
Change the TextView layout_width to "match_parent", the issue is that "gravity" works only for the child of the View in this case the "text" it self, hence if you specify the object width as just to wrap its content, it means there's no space to center to, filling the whole parent and using "gravity" center would do the trick.
The other thing you can do is changing the "android:gravity" property to "android:layout_gravity" and center horizontal, this way you are telling the TextView itself to move to the center...
As best practice always try to use RelativeLayouts and avoid LinearLayouts, they provide a better way to manipulate Views position and are "device size fragmentation" friendly, RelativeLayout have plenty of methods to position views on the most common positions including center, top, bottom etc...
Hope this Helps.
Regards!
Try changing the layout. Linear Layout is meant for displaying ui components in rows. If you want to center your textview using you layout, I suggest changing the layout to Relative Layout.
First of all you cant set the property android:layout_centerHorizontal="true" for a LinearLayout. To make it centered you need to make layout height and width to match_parent like below,
<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:id="#+id/userName"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_marginTop="10dp"
android:background="#80000000"
android:gravity="center"
android:padding="10dp"
android:text="User Name"
android:textColor="#FFFFFF"
android:textSize="12sp" />
</LinearLayout>
Try using:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:gravity="center" >
<TextView
android:id="#+id/userName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="#80000000"
android:gravity="center"
android:padding="10dp"
android:text="User Name"
android:textColor="#FFFFFF"
android:textSize="12sp" />
</LinearLayout>

Why is alignParentRight not working?

I'm a noob to android development and I am having issues constructing a layout. I have a relative layout containing a textview and a linear layout containing two checkboxes. I want the textView to appear to the left and the linear layout to appear on the right of the linear layout flush with the edge. Currently, the textview and linearlayout appear on top of each other. Any help is greatly appreciated.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:text="Rotated Shelf: "
android:layout_gravity="center_vertical"/>
<LinearLayout
android:id="#+id/rotated"
android:layout_width="match_parent"
android:layout_height="32dp"
android:layout_alignParentRight="true">
<CheckBox
android:id="#+id/rotatedshelfYES"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Yes"
android:layout_toLeftOf="#+id/rotatedshelfNO"
/>
<CheckBox
android:id="#+id/rotatedshelfNO"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingRight="75dp"
android:text="No"
android:layout_alignParentRight="true" />
</LinearLayout>
</RelativeLayout>
try like this your textview write with in linear-layout and set android:layout_weight="" it working nice
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<LinearLayout
android:id="#+id/rotated"
android:layout_width="match_parent"
android:layout_height="32dp"
android:layout_alignParentRight="true" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight=".5"
android:paddingLeft="5dp"
android:text="Rotated Shelf: " />
<CheckBox
android:id="#+id/rotatedshelfYES"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".25"
android:text="Yes" />
<CheckBox
android:id="#+id/rotatedshelfNO"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".25"
android:text="No" />
</LinearLayout>
</RelativeLayout>
on the LinearLayout add android:layout_toRightOf="#+id/textView2"
If you want to align the right edge of your TextView with the left edge of your LinearLayout (i.e. TextView to the left of LinearLayout) you should use
android:layout_toLeftOf="#+id/rotated"
in your TextView properties.
Use you have to set android:layout_width in linear layout equal to wrap_content not match_parent since match_parent is used when we want to equal the width/height as the parent of the widget/container and wrap_content as name suggest requires space only to write the caption of view/container, no extra space required.

Android RelativeLayout and equal alignment

I have a table row setup using relative layout. It has 2 TextView both of which I want to have equal spacing and left aligned text. See current setup below. This has one textview aligned left and another right. When I change to align both to left content overlaps.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout02"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="10dip">
<TextView
android:id="#+id/displayLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="20dp"
android:layout_toRightOf="#+id/row_image"
android:text="adasd"
android:textSize="18sp" />
<TextView
android:id="#+id/displayValue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="20dp"
android:text="adasd"
android:textSize="18sp"/>
</RelativeLayout>
Any suggestions. Thanks in advance for the help.
It seems like a job for weighted LinearLayout - display two equaly-sized text views:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout02"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="10dip">
<TextView
android:id="#+id/displayLabel"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:text="adasd"
android:textSize="18sp"
android:layout_weight="1"/>
<TextView
android:id="#+id/displayValue"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
android:text="adasd"
android:textSize="18sp"
android:layout_weight="1"/>
</LinearLayout>
Then in emulator it will looks like:
Note the layout_weight attribute in both text views and zero layout_width. Basically it means that the views will get additional amount of free space proportional to specified weight. So for equivalent weights these views will be of identical width.
See layout guide on developer.android.com for further reference.
Did you tried using following for displayValue TextView instead of alignParentRight?
android:layout_toRightOf="#id/displayLabel"
Then give some left margin.

Categories

Resources