I am trying to design as per the above image. I tried with Grid Layout and also tried with nested Linear Layout. In both ways checkbox is not right aligned. It is displaying just after the text1
Can someone help on this.
The code is:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="2dp"
tools:context="com.example.user.recycleview.MainActivity">
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="3">
<ImageView
android:layout_width="80dp"
android:layout_height="50dp"
android:layout_gravity="center_vertical"
android:layout_row="0"
android:layout_column="0"
android:layout_rowSpan="2"
android:src="#drawable/cappuccino"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="0"
android:layout_column="1"
android:layout_margin="8dp"
android:maxLines="3"
android:text="#string/cappuccino"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="-5dp"
android:layout_row="1"
android:layout_column="1"
android:layout_margin="8dp"
android:maxLines="1"
android:text="#string/price"/>
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="end"
android:layout_row="0"
android:layout_column="2"
android:layout_rowSpan="2" />
</GridLayout>
<View
android:layout_width="fill_parent"
android:layout_height="1dip"
android:layout_marginTop="3dp"
android:layout_marginBottom="3dp"
android:background="#color/colorPrimary"/>
</LinearLayout>
With the above code it is displaying as in the below:
If the Text1 part is too long, the checkbox is going out of the screen, as in the below image
You can achieve this by using a single RelativeLayout.
Try this:
<?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="match_parent"
android:layout_height="80dp"
android:padding="2dp"
tools:context="com.example.user.recycleview.MainActivity">
<ImageView
android:id="#+id/image"
android:layout_width="80dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:scaleType="centerCrop"
android:src="#drawable/somepngfile"/>
<CheckBox
android:id="#+id/checkbox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="8dp"/>
<TextView
android:id="#+id/text_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/image"
android:layout_toLeftOf="#id/checkbox"
android:layout_margin="8dp"
android:maxLines="2"
android:ellipsize="end"
android:text="This is two line text for your large title This is two line text for your large title"/>
<TextView
android:id="#+id/text_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/text_title"
android:layout_alignLeft="#id/text_title"
android:layout_alignRight="#id/text_title"
android:maxLines="1"
android:text="Price: 150.00"/>
<View
android:layout_width="fill_parent"
android:layout_height="1dip"
android:layout_alignParentBottom="true"
android:background="#color/colorPrimary"/>
</RelativeLayout>
OUTPUT:
You can use layout_weight to align checkbox right,
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:orientation="horizontal">
<TextView
android:id="#+id/itemTitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
<CheckBox
android:id="#+id/checkItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content" /></LinearLayout>
You can use relative layout for you list item . Try below code
<ImageView
android:id="#+id/imageView"
android:layout_width="80dp"
android:layout_height="50dp"
android:layout_alignParentLeft="true"
android:layout_gravity="center_vertical"/>
<CheckBox
android:id="#+id/checkbox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:gravity="end" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/checkbox"
android:layout_toRightOf="#id/imageView"
android:layout_weight=".8"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_margin="8dp"
android:layout_row="0"
android:maxLines="3"
android:text="#string/cappuccino" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_margin="8dp"
android:layout_marginTop="-5dp"
android:layout_row="1"
android:maxLines="1"
android:text="#string/price" />
</LinearLayout>
<View
android:layout_width="fill_parent"
android:layout_height="1dip"
android:layout_marginBottom="3dp"
android:layout_marginTop="3dp"
android:background="#color/colorPrimary" />
This is may helpful to you.
<?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="wrap_content"
android:orientation="vertical"
android:padding="2dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center">
<ImageView
android:id="#+id/imageView"
android:layout_width="120dp"
android:layout_height="70dp"
android:scaleType="fitXY"
android:src="#drawable/ic_image" />
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="#+id/imageView"
android:layout_toStartOf="#+id/checkBox"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_margin="8dp"
android:layout_row="0"
android:maxLines="3"
android:text="Sample Header" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_margin="8dp"
android:layout_row="1"
android:maxLines="1"
android:text="Sample Desc" />
</LinearLayout>
<CheckBox
android:id="#+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:gravity="center" />
</RelativeLayout>
<View
android:layout_width="fill_parent"
android:layout_height="1dip"
android:layout_marginBottom="3dp"
android:layout_marginTop="3dp"
android:background="#color/colorPrimary" />
</LinearLayout>
Related
I got a RelativeLayout and inside there are two LinearLayouts side by side. Now I want that the right one has a minimum width of 125dp. So when the left LinearLayout gets too big, it should stop before the other LinearLayout and not push that one away.
How can I achieve this? This is my current approach:
Layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/item_list_item"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5dp">
<ImageButton
android:id="#+id/basket_item_list_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:background="#android:color/transparent"
android:minWidth="50dp"
android:minHeight="50dp"
app:srcCompat="#drawable/ic_garbage"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_toRightOf="#+id/basket_item_list_delete"
android:layout_toEndOf="#+id/basket_item_list_delete">
<LinearLayout
android:id="#+id/basket_item_list_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:orientation="vertical">
<TextView
android:id="#+id/basket_item_list_itemname"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:text="ItemName"
android:textColor="#color/generalText"
android:textSize="18sp" />
<TextView
android:id="#+id/basket_item_list_options"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:text="Options"/>
</LinearLayout>
<LinearLayout
android:id="#+id/priceLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="125dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:orientation="vertical"
android:layout_toRightOf="#id/basket_item_list_description">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:id="#+id/basket_item_list_increment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/basket_item_list_count"
android:layout_toStartOf="#+id/basket_item_list_count"
android:minWidth="45dp"
android:minHeight="45dp"
android:text="+"
android:textSize="20sp"
android:textColor="#color/colorPrimary"
android:background="#android:color/transparent" />
<TextView
android:id="#+id/basket_item_list_count"
android:layout_width="35dp"
android:layout_height="wrap_content"
android:layout_alignParentEnd="false"
android:layout_alignParentRight="false"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/basket_item_list_decrement"
android:layout_toStartOf="#+id/basket_item_list_decrement"
android:gravity="center_horizontal"
android:text="nx"
android:textColor="#color/generalText"
android:textSize="14sp" />
<Button
android:id="#+id/basket_item_list_decrement"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:minWidth="45dp"
android:minHeight="45dp"
android:text="–"
android:textSize="20sp"
android:textColor="#color/colorPrimary"
android:background="#android:color/transparent" />
</RelativeLayout>
<TextView
android:id="#+id/basket_item_list_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="50dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginEnd="10dp"
android:layout_marginRight="10dp"
android:text="1€"
android:gravity="right"
android:layout_gravity="right"
android:textColor="#color/generalText"
android:textSize="14sp" />
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
I want to have it like this:
But this is what happens, when the left LinearLayout gets too big:
Try this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/item_list_item"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="5dp">
<ImageButton
android:id="#+id/basket_item_list_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:background="#android:color/transparent"
android:minHeight="50dp"
android:minWidth="50dp"
app:srcCompat="#drawable/ic_menu_gallery" />
<LinearLayout
android:id="#+id/basket_item_list_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:paddingBottom="10dp"
android:paddingTop="10dp">
<TextView
android:id="#+id/basket_item_list_itemname"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:text="ItemName"
android:textColor="#color/colorPrimary"
android:textSize="18sp" />
<TextView
android:id="#+id/basket_item_list_options"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:text="Options" />
</LinearLayout>
<LinearLayout
android:id="#+id/priceLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:gravity="right"
android:minWidth="125dp"
android:orientation="vertical"
android:paddingBottom="10dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center">
<Button
android:id="#+id/basket_item_list_increment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:minHeight="45dp"
android:minWidth="45dp"
android:text="+"
android:textColor="#color/colorPrimary"
android:textSize="20sp" />
<TextView
android:id="#+id/basket_item_list_count"
android:layout_width="35dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="nx"
android:textColor="#color/colorPrimary"
android:textSize="14sp" />
<Button
android:id="#+id/basket_item_list_decrement"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:minHeight="45dp"
android:minWidth="45dp"
android:text="–"
android:textColor="#color/colorPrimary"
android:textSize="20sp" />
</LinearLayout>
<TextView
android:id="#+id/basket_item_list_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:gravity="center"
android:minWidth="50dp"
android:text="1€"
android:textColor="#color/colorPrimary"
android:textSize="14sp" />
</LinearLayout>
</LinearLayout>
Let try this ,
It will divide a screen Half and Half.
<LinearLayout
android:id="#+id/priceLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/priceLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight=".5"
android:orientation="vertical">
///Your views
</LinearLayout>
<LinearLayout
android:id="#+id/priceLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight=".5"
android:orientation="vertical">
///Your views
</LinearLayout>
</LinearLayout>
If You want first Wrap another one take remaining width take this
<LinearLayout
android:id="#+id/priceLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/priceLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
///Your views
</LinearLayout>
<LinearLayout
android:id="#+id/priceLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
///Your views
</LinearLayout>
</LinearLayout>
I want to achieve like the image below
And I tried, but it is not my desired result.
Below is my xml
<?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="wrap_content"
android:orientation="horizontal"
android:padding="5dip">
<LinearLayout android:id="#+id/thumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dp"
android:layout_alignParentLeft="true"
android:layout_marginRight="5dip">
<ImageView
android:id="#+id/photo"
android:layout_width="70dp"
android:layout_height="70dp"
android:scaleType="centerCrop"
android:layout_gravity="center"/>
</LinearLayout>
<TextView
android:id="#+id/ListDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/input_register"
android:text="Date"
android:layout_marginLeft="150dp"
android:layout_alignTop="#+id/thumbnail"
android:layout_toRightOf="#+id/thumbnail" />
<TextView
android:id="#+id/ListDescription"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:textSize="20sp"
android:text="Description"
android:ellipsize="end"
android:textStyle="bold"
android:layout_below="#id/ListDate"
android:layout_toRightOf="#+id/thumbnail" />
<TextView
android:id="#+id/ListAmount"
android:text="Amount"
android:layout_marginTop="40dp"
android:layout_marginLeft="166dp"
android:textSize="20sp"
android:layout_width="fill_parent"
android:layout_height="30dp"
android:layout_toRightOf="#+id/thumbnail"
android:textColor="#color/violetred" />
</RelativeLayout>
How can I write the ... beside the Amount TextView same like the first image I post ? Any help is much appreciated.
You can have only one layout which will solve your problem nesting is not a good idea.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:textColor="#000"
android:layout_gravity="center"
android:textSize="?android:actionBarItemBackground"
android:textStyle="bold"
android:text="8 hours # $80.00/hour"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:text="2014-05-08"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/activity_horizontal_margin"
android:textStyle="bold"
android:layout_gravity="end"
android:textColor="#000"
android:textSize="?android:actionBarItemBackground"
android:text="$640.00"/>
</FrameLayout>
you can achieve your requirement with this xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#d8d8d8" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="85dp"
android:layout_height="85dp"
android:background="#c8c8c8"
android:src="#drawable/ic_launcher" >
</ImageView>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/imageView1"
android:text="TextView"
android:textColor="#000000" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginRight="6dp"
android:layout_marginTop="20dp"
android:padding="2dp"
android:text="2014-05-08"
android:textColor="#000000" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/textView2"
android:layout_marginRight="6dp"
android:layout_marginTop="20dp"
android:padding="2dp"
android:text="$600"
android:textColor="#000000"
android:textStyle="bold" />
</RelativeLayout>
hope this helps you.exact xml of you want to achieve.
<?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="wrap_content"
android:orientation="horizontal"
android:padding="5dip">
<ImageView
android:id="#+id/photo"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_margin="5dp"
android:padding="3dp"
android:scaleType="centerCrop"
android:layout_gravity="center"/>
<TextView
android:id="#+id/ListDescription"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/right_container"
android:singleLine="true"
android:textSize="20sp"
android:text="Description"
android:ellipsize="end"
android:textStyle="bold"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/photo" />
<LinearLayout
android:id="#+id/right_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:orientation="vertical">
<TextView
android:id="#+id/ListDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="#color/input_register"
android:text="12-11-2017"
android:layout_marginRight="10dp"/>
<TextView
android:id="#+id/ListAmount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="777$"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:textSize="20sp"
android:textColor="#color/violetred" />
</LinearLayout>
Use constraint layout for best performance. If not, use horizontal linear layout, with weight on the center one.
<?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="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="5dip">
<ImageView
android:id="#+id/photo"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:background="#color/black"
android:scaleType="centerCrop" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:ellipsize="end"
android:gravity="center_vertical"
android:lines="1"
android:text="Buy drinks fvbfvfvfvasdasdasdfvfvvfvf" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_vertical"
android:text="1014-05-08" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_vertical"
android:text="$6969"
android:textSize="18sp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#mipmap/ic_launcher" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1.5"
android:ellipsize="end"
android:maxLines="1"
android:text="ASASJHGHHBHHJHJNKMKIKMKMKMKMKKNIKNIJ" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="2016-01-11" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="$640"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
try 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="wrap_content"
android:orientation="horizontal"
android:layout_weight="1"
android:padding="5dip">
<LinearLayout android:id="#+id/thumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dp"
android:weightSum=".20"
android:layout_alignParentLeft="true"
android:layout_marginRight="5dip">
<ImageView
android:id="#+id/photo"
android:layout_width="70dp"
android:layout_height="70dp"
android:scaleType="centerCrop"
android:layout_gravity="center"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum=".80"
android:layout_alignRight="#+id/thumbnail"
android:layout_alignParentRight="true"
android:orientation="vertical">
<TextView
android:id="#+id/ListDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:layout_marginRight="10dp"
android:textColor="#color/input_register"
android:text="Date"
/>
<TextView
android:id="#+id/ListDescription"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:layout_marginRight="10dp"
android:textSize="20sp"
android:text="DescriptionDescriptionDescriptionDescription"
android:ellipsize="end"
android:textStyle="bold"
/>
<TextView
android:id="#+id/ListAmount"
android:text="Amount"
android:textSize="20sp"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_gravity="end"
android:layout_marginRight="10dp"
android:layout_toRightOf="#+id/thumbnail"
android:textColor="#color/violetred" />
</LinearLayout>
</LinearLayout>
I am trying to adjust the sizes of my textviews based on the size of the device. However it's partial adjustments. Let me show you what i mean:
The following picture depicts the desired effect. TextView B length determines the length of textview A, that is to say that part C is completely independent and is at the end with fixed size. If the textview A gets it's size reduced,then the end is elipsized. I have tried shifting from using LinearLayout with weights as well as RelativeLayout but haven't achieved the desired effect. Thoughts?
What i have tried:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:foobar="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="50dp"
android:paddingBottom="3dp"
android:paddingTop="3dp">
<com.android.volley.toolbox.NetworkImageView
android:id="#+id/thumbnail"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ddd"
android:scaleType="centerCrop"
android:visibility="invisible" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<com.ctrlplusz.anytextview.AnyTextView
android:id="#+id/tv2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/input"
android:ellipsize="end"
android:maxLength="20"
android:maxLines="1"
android:paddingLeft="7dp"
android:singleLine="true"
android:text="cshbcadhbhjvbbvjfbvcsdhabcsdjbvjsdbvjsfdbvsfnvk"
android:textColor="#color/black"
android:textSize="20dp"
foobar:typeface="Roboto-Light.ttf" />
<!--android:text="cshbcadhbhjvbbvjfbvcsdhabcsdjbvjsdbvjsfdbvsfnvk"-->
<RelativeLayout
android:id="#+id/input"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_gravity="center_vertical">
<com.ctrlplusz.anytextview.AnyTextView
android:id="#+id/price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/toggle"
android:gravity="end"
android:paddingRight="4dp"
android:text="3900"
android:textColor="#color/gray"
android:textSize="20dp"
foobar:typeface="Roboto-Light.ttf" />
<RelativeLayout
android:id="#+id/toggle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginRight="5dp"
android:gravity="end"
android:orientation="horizontal">
<RelativeLayout
android:id="#+id/minus"
android:layout_width="38dp"
android:layout_height="35dp"
android:layout_centerVertical="true"
android:background="#drawable/minus_product_icon">
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_minus" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/add"
android:layout_width="38dp"
android:layout_height="35dp"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/num"
android:background="#drawable/add_product_icon">
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_add_icon" />
</RelativeLayout>
<EditText
android:id="#+id/num"
android:layout_width="40dp"
android:layout_height="35dp"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/minus"
android:background="#drawable/product_custom_edit_text"
android:digits="1234567890"
android:focusable="true"
android:focusableInTouchMode="true"
android:gravity="center"
android:imeOptions="actionDone"
android:inputType="numberDecimal"
android:padding="2dp"
android:singleLine="true"
android:text="0"
android:textColor="#000"
android:textCursorDrawable="#drawable/mycursor" />
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
<com.ctrlplusz.anytextview.AnyTextView
android:id="#+id/p"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerVertical="true"
android:layout_gravity="center_vertical"
android:layout_marginLeft="11dp"
android:textColor="#color/gray"
android:textSize="20dp"
foobar:typeface="Roboto-Light.ttf" />
</RelativeLayout>
Something like this?
<?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="100dp"
android:orientation="vertical">
<TextView
android:id="#+id/a"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/blue"
android:textColor="#android:color/white"
android:text="hi dear"
android:layout_toLeftOf="#+id/b"/>
<TextView
android:id="#+id/b"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#color/black"
android:textColor="#android:color/white"
android:text="hello world"
android:layout_toLeftOf="#+id/c"/>
<TextView
android:id="#+id/c"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:textColor="#android:color/white"
android:text="hi darling"
android:background="#color/green"/>
</RelativeLayout>
<?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="100dp"
android:orientation="vertical">
<TextView
android:id="#+id/a"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#color/blue"
android:textColor="#android:color/white"
android:text="hi dear"
/>
<TextView
android:id="#+id/b"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#color/black"
android:textColor="#android:color/white"
android:text="hello world"
android:layout_toRightOf="#+id/a"
android:layout_toLeftOf="#+id/c"/>
<TextView
android:id="#+id/c"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:textColor="#android:color/white"
android:text="hi darling"
android:background="#color/green"/>
</RelativeLayout>
As B Is Dependent On A,This Layout Will Work Fine For You. :)
I am designing my android project on android studio. I used horizontal Linear Layout however it looks exactly the same as I wanted to be in Nexus 5, when I run the project on Nexus S, the view distorted. How can I fix this?
In nexus 5 view,
In nexus S view,
My xml file,
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="89dp"
android:layout_height="97dp"
android:layout_marginTop="10dp"
android:id="#+id/imageView3"
android:src="#drawable/photo"
android:layout_above="#+id/textView5"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Duygu Yeşim"
android:textColor="#color/blue"
android:id="#+id/textView5"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textStyle="bold"
android:layout_above="#+id/imageView4"
android:layout_centerHorizontal="true"
android:layout_marginBottom="10dp" />
<ImageView
android:layout_width="150dp"
android:layout_height="1dp"
android:background="#color/blue"
android:id="#+id/imageView4"
android:layout_above="#+id/linearLayout"
android:layout_centerHorizontal="true"
android:layout_marginBottom="14dp"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp">
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Kullanıcı Adı : "
android:id="#+id/textView8"
android:textColor="#color/blue"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="dygysm"
android:id="#+id/textView9"
android:textColor="#color/light_blue"/>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="3dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="E-mail Adresi :"
android:id="#+id/textView10"
android:textColor="#color/blue"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textEmailAddress"
android:ems="10"
android:id="#+id/editText"
android:background="#drawable/edit_design2"
android:hint="duygu.yesim#hotmail.com"
android:textSize="12sp"
android:textColorHint="#color/blue"
android:layout_marginLeft="4dp"/>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="3dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Doğum Tarihi : "
android:id="#+id/textView11"
android:textColor="#color/blue"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/dogum_tarihi"
android:layout_marginRight="5dp"
android:text="New Text"
android:textColor="#color/blue"
android:background="#drawable/edit_birtday_design"
android:drawableRight="#drawable/calendar"/>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/linearLayout"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
>
<ImageView
android:layout_width="310dp"
android:layout_height="1dp"
android:background="#color/light_blue"
android:id="#+id/imageView5"
android:layout_below="#+id/linearLayout"
android:layout_centerHorizontal="true" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bildirimler"
android:id="#+id/textView12"
android:textColor="#color/blue"/>
<Switch
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:layout_marginLeft="200dp"
android:layout_gravity="end"
android:id="#+id/switch1" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="3dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Şifre Değiştirme"
android:id="#+id/textView13"
android:singleLine="true"
android:textColor="#color/blue"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageButton2"
android:src="#drawable/right_arrow_orange"
android:background="#00000000"
android:layout_marginLeft="190dp"
android:layout_marginTop="5dp" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="310dp"
android:layout_height="1dp"
android:id="#+id/imageView6"
android:background="#color/light_blue"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"/>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:layout_width="87dp"
android:layout_height="27dp"
android:layout_marginTop="20dp"
android:layout_marginLeft="30dp"
android:background="#drawable/custom_kaydet_buton"
android:id="#+id/button" />
<Button
android:layout_width="87dp"
android:layout_height="27dp"
android:id="#+id/button2"
android:background="#drawable/custom_cikis_buton"
android:layout_marginTop="20dp"
android:layout_marginLeft="60dp"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
1) You will need to create multiple XML files as per screen sizes, Check this documentation - http://developer.android.com/guide/practices/screens_support.html
or
2) Put your Linear Layout in Horizontal Scroll View
Hope it will help :)
I have layout (list item):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="74dp"
android:background="#drawable/button_background">
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/list_separator"
android:id="#+id/event_separator"
android:layout_marginLeft="14dp"
android:layout_marginRight="14dp" />
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="73dp"
android:gravity="center_vertical">
<RelativeLayout
android:layout_width="65dp"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
<TextView
android:id="#+id/event"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="marquee"
android:maxLines="2"
android:text="Text text text"
android:textColor="#color/text"
android:textSize="14sp" />
<TextView
android:id="#+id/event_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="2"
android:text="2014.05.13\n16.20:33"
android:textColor="#color/text_faded"
android:textSize="10sp"
android:gravity="center|right"
android:layout_marginRight="14dp"
android:layout_marginEnd="14dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/event_delete"
android:src="#drawable/ic_delete" />
</LinearLayout>
</LinearLayout>
the first View is just list separator
then there's an ImageView icon
text TextView (id.event)
timestamp TextView (id.event_time)
another icon 'ImageView' (id.event_delete)
It does not work, I expect to get
[ 1 ]
[2][ 3 ][4][5]
But I get
[ 1 ]
[2][ 3 ]
4 and 5 are not visible (does not fit the screen).
When I add layout_weight="1" it kinda works but I don't know why:
<TextView
android:id="#+id/event"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="marquee"
android:maxLines="2"
android:text="Text text text"
android:textColor="#color/text"
android:textSize="14sp"
android:layout_weight="1" />
replace this
android:layout_width="match_parent"
by
android:layout_width="wrap_content"
for ur textview #+id/event
you specifing textview width to match_parent so it will occupy all width so 4 and 5 are not visible
edit:
<?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="74dp"
android:background="#ffffff"
android:orientation="vertical" >
<View
android:id="#+id/event_separator"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginLeft="14dp"
android:layout_marginRight="14dp"
android:background="#000000" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="73dp"
android:gravity="center_vertical"
android:orientation="horizontal"
android:weightSum="5" >
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
<TextView
android:id="#+id/event"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:ellipsize="marquee"
android:maxLines="2"
android:text="Text text text"
android:textColor="#000000"
android:textSize="14sp" />
<TextView
android:id="#+id/event_time"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="14dp"
android:layout_marginRight="14dp"
android:layout_weight="1"
android:gravity="center|right"
android:maxLines="2"
android:text="2014.05.13\n16.20:33"
android:textColor="#000000"
android:textSize="10sp" />
<ImageView
android:id="#+id/event_delete"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/ic_launcher" />
</LinearLayout>
</LinearLayout>
If you want it just like you specified you are preferred to give android:layout_weight to all the views in the second LinearLayout and set android:layout_width="0dp" as stated here:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="73dp"
android:gravity="center_vertical">
<RelativeLayout
android:layout_width="65dp"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
<TextView
android:id="#+id/event"
android:layout_width="0dp"
android:layout_weight="2"
android:layout_height="wrap_content"
android:ellipsize="marquee"
android:maxLines="2"
android:text="Text text text"
android:textColor="#color/text"
android:textSize="14sp" />
<TextView
android:id="#+id/event_time"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:maxLines="2"
android:text="2014.05.13\n16.20:33"
android:textColor="#color/text_faded"
android:textSize="10sp"
android:gravity="center|right"
android:layout_marginRight="14dp"
android:layout_marginEnd="14dp"/>
<ImageView
android:scaleType="fitCenter"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:id="#+id/event_delete"
android:src="#drawable/ic_delete" />
</LinearLayout>