I've got a listrow in a listview. In Android Studio the preview is showing the desired effect:
However on the device the text alignment is off:
The layout for the listrow is this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/list_row"
android:layout_width="fill_parent"
android:layout_height="80dp"
android:orientation="horizontal"
android:layout_margin="5dp"
android:background="#drawable/list_row">
<LinearLayout
android:id="#+id/date_field_lv"
android:layout_width="80dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center"
android:background="#color/apptheme_color"
android:layout_marginTop="2dp"
android:layout_marginBottom="2dp"
android:layout_marginLeft="2dp"
android:layout_marginRight="10dp">
<TextView
android:id="#+id/day_lv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textStyle="bold"
android:textSize="30sp"
android:fontFamily="sans-serif-condensed"
android:text="01"/>
<TextView
android:id="#+id/month_lv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textSize="15sp"
android:translationY="-7dp"
android:text="JUL"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_toRightOf="#id/date_field_lv"
android:orientation="vertical"
android:gravity="center_vertical">
<TextView
android:id="#+id/moment_lv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/text"
android:textStyle="bold"
android:textSize="20sp"
android:text="Lorum Ipsum"/>
<TextView
android:id="#+id/type_lv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/sub_text"
android:textSize="18sp"
android:text="Placeholder"/>
</LinearLayout>
</RelativeLayout>
What is causing the misalignment on the actual device?
try this,
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/list_row"
android:layout_width="fill_parent"
android:layout_height="80dp"
android:layout_margin="5dp"
android:background="#android:color/darker_gray"
android:orientation="horizontal" >
<LinearLayout
android:id="#+id/date_field_lv"
android:layout_width="80dp"
android:layout_height="match_parent"
android:layout_marginBottom="2dp"
android:layout_marginLeft="2dp"
android:layout_marginRight="10dp"
android:layout_marginTop="2dp"
android:background="#android:color/holo_orange_light"
android:gravity="center"
android:orientation="vertical" >
<TextView
android:id="#+id/day_lv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-condensed"
android:text="01"
android:textColor="#android:color/white"
android:textSize="30sp"
android:textStyle="bold" />
<TextView
android:id="#+id/month_lv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="JUL"
android:textColor="#android:color/white"
android:textSize="15sp"
android:translationY="-7dp" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_toRightOf="#id/date_field_lv"
android:gravity="center_vertical"
android:orientation="vertical" >
<TextView
android:id="#+id/moment_lv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="0dp"
android:padding="0dp"
android:text="Lorum Ipsum"
android:textColor="#android:color/white"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:id="#+id/type_lv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="0dp"
android:padding="0dp"
android:text="Placeholder"
android:textColor="#android:color/white"
android:textSize="18sp" />
</LinearLayout>
</RelativeLayout>
Related
I want to achieve following layout:
My problem is that the background of the right buttons is stretched. It tried to do it like this:
<?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:background="#drawable/tab_gradient_background"
android:weightSum="1"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".1"
android:background="#color/button_released"
android:orientation="horizontal">
<TextView
android:id="#+id/highscoreTextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight=".7"
android:background="#drawable/menu_button_background_released"
android:gravity="center"
android:text="#string/highscore"
android:textColor="#color/white"
android:textSize="#dimen/menu_text" />
<TextView
android:id="#+id/highscoreNumberTextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_weight=".3"
android:background="#drawable/menu_button_background_released_mirrored"
android:text="0"
android:textColor="#color/white"
android:textSize="#dimen/menu_text" />
</LinearLayout>
</LinearLayout>
It looks like this:
Any ideas how to solved this?
It wasn't that easy that I was thinking it would be, but I managed somehow to rectify this through "9patch" images.
Here is the code:
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="100"
android:layout_marginTop="5dp"
android:orientation="horizontal">
<TextView
android:id="#+id/highscoreTextView"
android:layout_width="0dp"
android:layout_weight="70"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/menu_button_background_released"
android:gravity="center"
android:text="High Scores"
android:textColor="#ffffff"
android:textSize="15sp" />
<TextView
android:id="#+id/highscoreNumberTextView"
android:layout_width="0dp"
android:layout_weight="30"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#drawable/menu_button_background_released_mirrored"
android:text="0"
android:textColor="#ffffff"
android:textSize="15sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="100"
android:layout_marginTop="5dp"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_weight="66"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/menu_button_background_released"
android:gravity="center"
android:text="High Scores"
android:textColor="#ffffff"
android:textSize="15sp" />
<TextView
android:layout_width="0dp"
android:layout_weight="34"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#drawable/menu_button_background_released_mirrored"
android:text="0"
android:textColor="#ffffff"
android:textSize="15sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="100"
android:layout_marginTop="5dp"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_weight="62"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/menu_button_background_released"
android:gravity="center"
android:text="High Scores"
android:textColor="#ffffff"
android:textSize="15sp" />
<TextView
android:layout_width="0dp"
android:layout_weight="38"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#drawable/menu_button_background_released_mirrored"
android:text="0"
android:textColor="#ffffff"
android:textSize="15sp" />
</LinearLayout>
The image below shows my desired layout.
I am able to get the image view and the first textview in the correct position. However, the other two textview is apprearing below the imageview.
Can anyone help please?
<?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" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="#+id/icon"
android:layout_width="110dp"
android:layout_height="110dp"
android:background="#drawable/attraction_bg"
android:gravity="left"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="15dp"
android:layout_marginTop="10dp" />
<TextView
android:layout_toRightOf="#id/icon"
android:id="#+id/row1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:textColor="#android:color/black"
android:textSize="20dp"
android:layout_weight="1" />
<TextView
android:id="#+id/row2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:textColor="#android:color/black"
android:textSize="20dp" />
<TextView
android:id="#+id/row3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:textColor="#android:color/black"
android:textSize="20dp" />
</LinearLayout>
</LinearLayout>
You just need to switch your LinearLayouts
Try something like this:
<?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="horizontal" >
<ImageView
android:id="#+id/icon"
android:layout_width="110dp"
android:layout_height="110dp"
android:background="#drawable/attraction_bg"
android:gravity="left"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="15dp"
android:layout_marginTop="10dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:layout_toRightOf="#id/icon"
android:id="#+id/row1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:textColor="#android:color/black"
android:textSize="20dp"
android:text="line 1"
android:layout_weight="1" />
<TextView
android:id="#+id/row2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:textColor="#android:color/black"
android:text="line 2"
android:textSize="20dp" />
<TextView
android:id="#+id/row3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:textColor="#android:color/black"
android:text="line 3"
android:textSize="20dp" />
</LinearLayout>
</LinearLayout>
Use this in your 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="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/icon"
android:layout_width="110dp"
android:layout_height="110dp"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="15dp"
android:layout_marginTop="10dp"
android:adjustViewBounds="true"
android:background="#mipmap/ic_launcher"
android:gravity="left"
android:scaleType="fitXY" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/row1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:layout_weight="1"
android:text="TextView 1"
android:textColor="#android:color/black"
android:textSize="20dp" />
<TextView
android:id="#+id/row2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="TextView 1"
android:textColor="#android:color/black"
android:textSize="20dp" />
<TextView
android:id="#+id/row3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="TextView 1"
android:textColor="#android:color/black"
android:textSize="20dp" />
</LinearLayout>
</LinearLayout>
you should use RelativeLayout like this:
<?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" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/icon"
android:layout_width="110dp"
android:layout_height="110dp"
android:background="#color/colorPrimary"
android:gravity="left"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="15dp"
android:layout_marginTop="10dp" />
<TextView
android:layout_toRightOf="#id/icon"
android:id="#+id/row1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:textColor="#android:color/black"
android:textSize="20dp"
android:text="text one"
/>
<TextView
android:text="text two"
android:id="#+id/row2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:textSize="20dp"
android:layout_below="#+id/row1"
android:layout_toRightOf="#+id/icon"
android:layout_toEndOf="#+id/icon" />
<TextView
android:text="text third"
android:id="#+id/row3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:textSize="20dp"
android:layout_below="#+id/row2"
android:layout_toRightOf="#+id/icon"
android:layout_toEndOf="#+id/icon" />
</RelativeLayout>
You have to use relative Layout check the 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="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/icon"
android:layout_width="110dp"
android:layout_height="110dp"
android:gravity="left"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:layout_marginBottom="2dp"
android:background="#drawable/attraction_bg"
android:layout_marginLeft="10dp"
android:layout_marginRight="15dp"
android:layout_marginTop="10dp" />
<TextView
android:id="#+id/row2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_toRightOf="#id/icon"
android:textColor="#android:color/black"
android:textSize="20dp" />
<TextView
android:id="#+id/row3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:textSize="20dp"
android:layout_below="#+id/row1"
android:layout_toRightOf="#id/icon"
/>
<TextView
android:id="#+id/row1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:textSize="20dp"
android:layout_weight="1"
android:layout_toRightOf="#id/icon"
android:layout_below="#+id/row2"
/>
</RelativeLayout>
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'm trying to integrate a vertical colored bar in front of my custom listview. I cannot succeed and I hope anyone could help me out.
The correct way without the colored bar:
The XML code of the above image:
<?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="vertical"
android:padding="4dp" >
<TextView
android:id="#+id/subject"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textStyle="bold" />
<TextView
android:id="#+id/relation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/default_green"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/ticketDepartmentName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#999999"
android:textSize="14sp"
android:textStyle="bold" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/ticketDueDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/color_transparent"
android:gravity="center_horizontal"
android:textColor="#color/red"
android:textStyle="bold" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/priority"
android:layout_width="90dp"
android:layout_height="wrap_content"
android:layout_marginRight="3dp"
android:layout_toLeftOf="#id/status"
android:background="#drawable/default_button"
android:gravity="center_horizontal"
android:textColor="#ffffff" />
<TextView
android:id="#+id/status"
android:layout_width="90dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="#drawable/salesdesk_button"
android:gravity="center_horizontal"
android:textColor="#ffffff" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
A nice try can be found here but does not work properly:
You could always add an imageview with an image of a vertical bar with the desired color inside another root LinearLayout which would be horizontal.
Try this..
<?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" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/colorBar"
android:layout_width="4dp"
android:layout_height="match_parent"
android:background="#478848" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/subject"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Text1"
android:textStyle="bold" />
<TextView
android:id="#+id/relation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Text2"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/ticketDepartmentName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Text3"
android:textColor="#999999"
android:textSize="14sp"
android:textStyle="bold" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/ticketDueDate"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.4"
android:text="Text4"
android:textStyle="bold" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.6"
android:orientation="horizontal" >
<TextView
android:id="#+id/priority"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:background="#F89407"
android:gravity="center"
android:text="priority"
android:textColor="#ffffff" />
<TextView
android:id="#+id/status"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:background="#478948"
android:gravity="center"
android:text="status"
android:textColor="#ffffff" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
I'm trying to integrate a color bar like example below in my XML file which is currently working properply only integrating this colored vertical bar is making it difficult.
My custom listview adapterview which works without any color bar
<?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="vertical"
android:padding="4dp" >
<TextView
android:id="#+id/subject"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textStyle="bold" />
<TextView
android:id="#+id/relation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/default_green"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/ticketDepartmentName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#999999"
android:textSize="14sp"
android:textStyle="bold" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/ticketDueDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/color_transparent"
android:gravity="center_horizontal"
android:textColor="#color/red"
android:textStyle="bold" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/priority"
android:layout_width="90dp"
android:layout_height="wrap_content"
android:layout_marginRight="3dp"
android:layout_toLeftOf="#id/status"
android:background="#drawable/default_button"
android:gravity="center_horizontal"
android:textColor="#ffffff" />
<TextView
android:id="#+id/status"
android:layout_width="90dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="#drawable/salesdesk_button"
android:gravity="center_horizontal"
android:textColor="#ffffff" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
I succeeded for let us say 50% to make it work with a textview but it's not how it should be. Here the code I got after a while.
<?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"
android:orientation="vertical" >
<TextView
android:id="#+id/colorBar"
android:layout_width="4dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:background="#drawable/default_button" />
<TextView
android:id="#+id/subject"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/colorBar"
android:textStyle="bold" />
<TextView
android:id="#+id/relation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/subject"
android:layout_toRightOf="#id/colorBar"
android:textColor="#color/default_green"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/ticketDepartmentName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/relation"
android:layout_toRightOf="#id/colorBar"
android:textColor="#999999"
android:textSize="14sp"
android:textStyle="bold" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/ticketDueDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/color_transparent"
android:gravity="center_horizontal"
android:textColor="#color/red"
android:textStyle="bold" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/priority"
android:layout_width="90dp"
android:layout_height="wrap_content"
android:layout_marginRight="3dp"
android:layout_toLeftOf="#id/status"
android:background="#drawable/default_button"
android:gravity="center_horizontal"
android:textColor="#ffffff" />
<TextView
android:id="#+id/status"
android:layout_width="90dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="#drawable/default_button"
android:gravity="center_horizontal"
android:textColor="#ffffff" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
This looks like so As you can see the colored bar stops in the middle I have no idea why and my last Relative and Linearlayout get messed up. Please help, thanks in advance!
Try this..
<?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" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/colorBar"
android:layout_width="4dp"
android:layout_height="match_parent"
android:background="#478848" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/subject"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Text1"
android:textStyle="bold" />
<TextView
android:id="#+id/relation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Text2"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/ticketDepartmentName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Text3"
android:textColor="#999999"
android:textSize="14sp"
android:textStyle="bold" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/ticketDueDate"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.4"
android:text="Text4"
android:textStyle="bold" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.6"
android:orientation="horizontal" >
<TextView
android:id="#+id/priority"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:background="#F89407"
android:gravity="center"
android:text="priority"
android:textColor="#ffffff" />
<TextView
android:id="#+id/status"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:background="#478948"
android:gravity="center"
android:text="status"
android:textColor="#ffffff" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>