ListView Row Height Too Small - android

Below is an image of a ListView row that is too short. I've tried too many combinations and yield my frustration to StackOverflow.
How can I fix this and show the whole row? Here is the XML for the item.
<?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="fill_parent"
android:weightSum="1">
<LinearLayout android:id="#+id/item_left"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:paddingRight="2dp"
android:paddingLeft="2dp"
android:background="#drawable/item_left"
android:layout_gravity="fill_vertical">
<TextView
android:id="#+id/status_day"
android:layout_gravity="center_vertical"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:textColor="#color/item_left_text"
android:textSize="25sp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingLeft="2dp"
android:background="#drawable/item_right"
android:layout_weight="1">
<TextView
android:id="#+id/date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/item_right_text"
android:text="" />
<TextView
android:id="#+id/message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/item_right_text"
android:text="" />
</LinearLayout>
<ImageButton
android:id="#+id/options"
android:background="#drawable/item_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_menu_moreoverflow_normal_holo_light"
/>
</LinearLayout>
Any help is appreciated.

can you use this, set row layout height
android:layout_height="?android:attr/listPreferredItemHeight"

I set the height of the ImageButton to match_parent.
This fixed the issue oddly. Sigh.

your layout should be in such manner for your requirement i have pasted not same as your's layout but related to it check it
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="60dp" >
<ImageView
android:id="#+id/ivArrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:focusable="false"
android:clickable="false"
android:src="#drawable/arrow" />
<RelativeLayout
android:id="#+id/ivIcon"
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:focusable="false"
android:clickable="false"
android:background="#drawable/oddnumbg" >
<TextView
android:id="#+id/tvNo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="15dp"
android:textColor="#color/ReceiptNoLable"
android:text="No." />
<TextView
android:id="#+id/tvReceiptNo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:singleLine="true"
android:layout_below="#+id/tvNo"
android:gravity="center"
android:textColor="#color/ReceiptSavedColor"
android:textSize="18dp"
android:text="1234" />
</RelativeLayout>
<TextView
android:id="#+id/tvSubName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="15dp"
android:layout_marginTop="10dp"
android:layout_toRightOf="#+id/ivIcon"
android:text="RECEIVED FROM"
android:gravity="center"
android:focusable="false"
android:clickable="false"
android:textColor="#color/ReceiptNoLable"
/>
<TextView
android:id="#+id/tvName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/ivIcon"
android:layout_below="#+id/tvSubName"
android:text="RECEIPT"
android:layout_marginLeft="15dp"
android:textColor="#color/ReceiptSavedColor"
android:textSize="30dp"
android:focusable="false"
android:layout_toLeftOf="#+id/tvReceiptPrize"
android:clickable="false"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/tvReceiptPrize"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/ivArrow"
android:background="#drawable/myreceiptprizebg"
android:gravity="center"
android:singleLine="true"
android:layout_marginRight="5dp"
android:textSize="20dp"
android:textColor="#fff"
android:text="$84.20" />
</RelativeLayout>
</LinearLayout>

just set the height of the outer layout, instead of using fill_parent
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:awesome="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height=50dp <!-- or anything which fits -->

Related

Image, text/text and image in Android

I am trying to get the following design. Consider that it is a list item.
But my following design, it does not give me that design.The textviews come on the top of left image.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#FFFFFF">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_person_black_24dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:id="#+id/userimage" />
<TextView
android:text="Text1"
android:layout_toRightOf="#id/userimage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/username"/>
<TextView
android:text="Text2"
android:layout_below="#id/name"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_keyboard_arrow_right_black"
android:layout_alignParentRight="true"
android:layout_centerVertical="true" />
</RelativeLayout >
Instead of a LinearLayout use a RelativeLayout, and for the TextViews use:
android:layout_toRightOf="#id/userimage" and
android:layout_alignTop="#id/userimage" or
android:layout_alignBottom="#id/userimage"
Here you go:
<?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="wrap_content"
android:background="#FFFFFF"
android:orientation="horizontal">
<ImageView
android:id="#+id/userimage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_person_black_24dp"
tools:background="#mipmap/ic_launcher" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignBottom="#id/userimage"
android:layout_toEndOf="#id/userimage"
android:layout_toStartOf="#id/arrow"
android:orientation="vertical">
<TextView
android:id="#+id/username"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center|start"
tools:text="Text1" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center|start"
tools:text="Text2" />
</LinearLayout>
<ImageView
android:id="#+id/arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_keyboard_arrow_right_black"
tools:background="#mipmap/ic_launcher" />
</RelativeLayout>
Try to play with different layouts when you have time, it will help you greatly in the future.
Edit:
Better solution for centering TextViews.
Your problem in text2 use it , it would work
<TextView
android:text="Text2"
android:layout_below="#id/username"
android:layout_toRightOf="#id/userimage"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
Try this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="6dip" >
<ImageView
android:id="#+id/userimage"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:layout_marginRight="6dip"
android:contentDescription="TODO"
android:src="#drawable/ic_person_black_24dp" />
<ImageView
android:id="#+id/icon"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="6dip"
android:contentDescription="TODO"
android:src="#drawable/ic_keyboard_arrow_right_black" />
<TextView
android:id="#+id/username"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_above="#id/secondline"
android:layout_alignParentTop="true"
android:layout_toRightOf="#id/userimage"
android:layout_toLeftOf="#id/icon"
android:singleLine="true"
android:gravity="center_vertical"
android:text="Example username"
android:textSize="16sp" />
<TextView
android:id="#+id/secondline"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_weight="1"
android:layout_alignParentRight="true"
android:layout_toRightOf="#id/userimage"
android:layout_toLeftOf="#id/icon"
android:singleLine="true"
android:text="Description"
android:textSize="12sp" />
</RelativeLayout>
I used some dp sizes that you did not use and added a few other things, but I guess you can change it so that it suits your desire. I did try use the same names as you did. Overall this should work if you tweak it a bit.

Can't create a view in layout

i've got a ListView with a custom adapter so i can customize the single row. I would create a view in the layout on the left that has as height all row height, and as width something like 5dp. So it will be like a little "strip" on the left of each row in the listview. I tried in this way
<?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:layout_margin="5dp"
android:background="#layout/cardwhite"
android:orientation="vertical" >
<TextView
android:id="#+id/first"
android:layout_toRightOf="#+id/viewlist"
android:layout_marginLeft="5dp"
android:textSize="15dp"
android:fontFamily="sans-serif-light"
android:text="Partenza "
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<View
android:id="#id/viewlist"
android:gravity="left"
android:layout_width="5dp"
android:background="#52BD4F"
android:layout_margin="5dp"
android:layout_height="match_parent"
/>
<TextView
android:id="#+id/second"
android:layout_toRightOf="#id/viewlist"
android:layout_below="#id/first"
android:textSize="15dp"
android:layout_marginLeft="5dp"
android:fontFamily="sans-serif-light"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</RelativeLayout>
But using android:layout_height="match_parent" or android:layout_height="wrap_content" not works and the strip doesn't appear. If i write android:layout_height="20dp" it goes but of course it's not "dynamic". I don't understand why it desappears.. Any ideas?
Please modify the layout accordingly. I have already done this one, so I'm just pasting it. You just need to make use of android:layout_alignBottom and android:layout_alignTop with proper id inside your View. Here is the screen shot !
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#e5e4e2" >
<RelativeLayout
android:id="#+id/relative_row"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/btn_normal" >
<TextView
android:layout_width="5dp"
android:layout_height="match_parent"
android:layout_alignBottom="#+id/tv_type"
android:layout_alignTop="#+id/tv_dayName"
android:background="#00ff00" />
<TextView
android:id="#+id/tv_dayName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_gravity="center_vertical"
android:padding="5dp"
android:layout_marginLeft="5dp"
android:text="Monday"
android:textColor="#000000"
android:textSize="14sp" >
</TextView>
<TextView
android:id="#+id/tv_dateNumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_gravity="center_vertical"
android:padding="5dp"
android:text="23"
android:textColor="#000000"
android:textSize="14sp" >
</TextView>
<TextView
android:id="#+id/tv_type"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tv_dayName"
android:layout_gravity="center_vertical"
android:padding="5dp"
android:layout_marginLeft="5dp"
android:text="Mark Attendance"
android:textColor="#000000"
android:textSize="12sp" >
</TextView>
<TextView
android:id="#+id/tv_monthName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/tv_dateNumber"
android:layout_gravity="center_vertical"
android:padding="5dp"
android:text="Apr-14"
android:textColor="#000000"
android:textSize="12sp" >
</TextView>
</RelativeLayout>
<!--
<TextView android:id="#+id/tv_line"
android:layout_width="fill_parent"
android:layout_height="1dp"
android:layout_marginTop="5dp"
android:background="#drawable/text_line"
android:layout_below="#+id/relative_row"/>
-->
</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="wrap_content"
android:layout_margin="5dp"
android:background="#layout/cardwhite"
android:orientation="vertical" >
<TextView
android:id="#+id/first"
android:layout_toRightOf="#+id/viewlist"
android:layout_marginLeft="5dp"
android:textSize="15dp"
android:fontFamily="sans-serif-light"
android:text="Partenza "
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<View
android:id="#id/viewlist"
android:gravity="left"
android:layout_alignTop="#+id/first"
android:layout_alignBottom="#+id/second"
android:layout_width="5dp"
android:background="#52BD4F"
android:layout_margin="5dp"
android:layout_height="match_parent"
/>
<TextView
android:id="#+id/second"
android:layout_toRightOf="#id/viewlist"
android:layout_below="#id/first"
android:textSize="15dp"
android:layout_marginLeft="5dp"
android:fontFamily="sans-serif-light"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</RelativeLayout>
Dont use relative layout just linearLayout
sample:
Beware that I dont have your cardwhite image so it wont be look like that one that you posted but just put the image in the linear layout background and it will look like the same as the one you posted.
<?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:layout_margin="5dp"
android:background="#layout/cardwhite"
android:orientation="horizontal" >
<View
android:id="#id/viewlist"
android:layout_width="5dp"
android:layout_height="match_parent"
android:background="#52BD4F" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:orientation="vertical" >
<TextView
android:id="#+id/first"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:fontFamily="sans-serif-light"
android:text="Customer 1"
android:textSize="15dp" />
<TextView
android:id="#+id/second"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:fontFamily="sans-serif-light"
android:text="Meeting"
android:textSize="20dp" />
</LinearLayout>
</LinearLayout>
result:
Here is a small trick. Instead of giving height to the view use a TextView and give Height as MatchParant and set TextSize according to your need and set Background color to your TextView. Hope this helps you!
<TextView
android:id="#+id/col_status"
android:layout_width="5dp"
android:layout_height="match_parent"
android:layout_marginBottom="3dp"
android:layout_marginLeft="3dp"
android:layout_marginTop="3dp"
android:background="#FFFFFF"
android:rotation="180"
android:textColor="#color/main_list_text"
android:textSize="12sp" />

GridLayout - Aligning Element

I am trying to reduce the space between 2 columns, have tried using negative margins, but did not work. Is there a way to bring the 2 elements in the image closer ?
<?xml version="1.0" encoding="utf-8"?>
<GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:useDefaultMargins="true"
android:alignmentMode="alignBounds"
android:columnOrderPreserved="false"
android:layout_gravity="center"
android:orientation="horizontal"
android:stretchMode="columnWidth"
android:background="#color/orange"
android:textSize="12sp"
android:columnCount="8">
<ImageButton
android:id="#+id/settings"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnSpan="1"
android:layout_gravity="left"
android:src="#drawable/settings" />
<TextView
android:id="#+id/currentCityName"
android:layout_column="2"
android:textSize="22sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="City name"
android:layout_columnSpan="4"
android:layout_gravity="center_horizontal"
/>
<ImageButton
android:id="#+id/refresh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="7"
android:layout_columnSpan="1"
android:layout_gravity="right"
android:src="#drawable/reload" />
<ImageView
android:id="#+id/currentWeatherImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnSpan="8"
android:layout_rowSpan="3"
android:layout_gravity="center_horizontal"
android:src="#drawable/cloud" />
<ImageView
android:id="#+id/humidityIcon"
android:layout_width="20dp"
android:paddingTop="10dp"
android:paddingLeft="0dp"
android:paddingRight="0dp"
android:layout_marginRight="0dp"
android:layout_gravity="left"
android:background="#000000"
android:src="#drawable/humidity" />
<TextView
android:id="#+id/humidity"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="13sp"
android:paddingTop="10dp"
android:paddingLeft="0dp"
android:layout_marginLeft="0dp"
android:layout_gravity="left"
android:background="#FFFFFF"
/>
<TextView
android:id="#+id/temperature"
android:layout_columnSpan="4"
android:layout_rowSpan="2"
android:textSize="49sp"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:layout_gravity="center_horizontal"/>
<ImageView
android:id="#+id/windSpeedIcon"
android:layout_width="30dp"
android:layout_marginRight="1dp"
android:paddingRight="1dp"
android:layout_gravity="right"
android:src="#drawable/wind" />
<TextView
android:id="#+id/windSpeed"
android:textSize="12sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
/>
<!-- android:layout_width="40dp" -->
<TextView
android:id="#+id/precipitationIcon"
android:textSize="28sp"
android:layout_width="40dp"
/>
<TextView
android:id="#+id/precipitation"
android:layout_column="0"
android:textSize="13sp"
android:layout_width="40dp"
/>
<TextView
android:id="#+id/windDirection16Point"
android:textSize="13sp"
android:layout_width="80dp"
android:layout_columnSpan="2"
/>
<TextView
android:id="#+id/weatherDescription"
android:layout_gravity="center_horizontal"
android:layout_row="7"
android:layout_columnSpan="8"/>
<TextView
android:id="#+id/section_label"
android:layout_margin="5dp"
android:layout_columnSpan="8" />
<EditText
android:minLines="4"
android:maxLines="4"
android:id="#+id/edit"
android:layout_columnSpan="8"/>
I suggest implementing the entire view using a RelativeLayout, should be the best solution for the entire view.
You are tackling the wrong problem – you are asking how to reduce the space between columns in a grid layout, but maybe you should’t have used such a layout in the first place!
What you should have been using for your specific layout, is a combination of relative positioning and compound drawables (here, with android:drawableStart).
<?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="80dp"
android:background="#d89018"
android:paddingBottom="4dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:paddingTop="4dp"
>
<TextView
android:id="#+id/temperature"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:text="25 ℃"
android:textColor="#fff"
android:textSize="49sp"
/>
<TextView
android:id="#+id/humidity"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:drawableStart="#drawable/humidity"
android:gravity="center_vertical"
android:text="83 %"
android:textColor="#fff"
/>
<TextView
android:id="#+id/windSpeed"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentEnd="true"
android:drawableStart="#drawable/wind"
android:gravity="center_vertical"
android:text="19 km/h"
android:textColor="#fff"
/>
<TextView
android:id="#+id/precipitation"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:drawableStart="#drawable/precipitation"
android:gravity="center_vertical"
android:text="0.1 mm"
android:textColor="#fff"
/>
<TextView
android:id="#+id/windDirection16Point"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_alignLeft="#id/windSpeed"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:drawableStart="#drawable/windDirection"
android:gravity="center_vertical"
android:text="NNW"
android:textColor="#fff"
/>
</RelativeLayout>
Not only this layout is simpler, you also let Android take care of all the spacing for you. To change the spacing between the compound drawable and the text, use android:drawablePadding in the layout’s code above; in Java code, that would be TextView.setCompoundDrawablePadding).
Icons used for the sample: water, windsock, rainy-weather and wind-rose.
I think what's happening is that your Views are being stretched because they are trying to match the width of another view in their columns.
Try decreasing the columnSpan of your Views or separate your layout into two separate GridLayouts.
Or, consider using a different layout altogether. I would recommend RelativeLayout here instead of GridLayout, but I don't know how this fits into a larger window.
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="100dp">
<LinearLayout
android:id="#+id/col1"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_weight="2.4"
>
<LinearLayout
android:id="#+id/col1_row1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="83%"/>
</LinearLayout>
<LinearLayout
android:id="#+id/col1_row2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1.0mm"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/col2"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_weight="2.0"
android:gravity="center"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="25'"
android:textSize="50dp"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/col3"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_weight="2.4"
>
<LinearLayout
android:id="#+id/col3_row1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="19Km"/>
</LinearLayout>
<LinearLayout
android:id="#+id/col3_row2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="NNW"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
I think you should change usedefaultMargins to false and give your own margins to the elements.
android:useDefaultMargins="false";

LinearLayout: TextViews at left, big ImageView at right

i'm working on a LinearLayout but unfortunately it's not working as it should.
The goal is to have a LinearLayout with two TextViews (one placed below the other) on the left side, and an ImageView on the right side.
The ImageView should be as big as possible, the TextViews should take the remaining space.
At the moment my layout XML is like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_linearlayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_margin="1dp"
android:background="#drawable/background" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="2dp"
android:orientation="vertical" >
<TextView
android:id="#+id/layout1label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:singleLine="true"
android:text="1234"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/layout2label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1234_label2"
android:textSize="14dp" />
</LinearLayout>
<ImageView
android:id="#+id/layout_image"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical"
android:layout_margin="2dp"
android:layout_weight="1"
android:adjustViewBounds="true"
android:src="#drawable/ic_launcher" />
The part that isn't working: If the text in the TextViews is "too long", the ImageView gets shrinked. I want it exactly the other way round.
Any solutions?
It would be more efficient to use RelativeLayout instead of LinearLayout. Then you can place your views without having to nest layouts:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/image"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
/>
<TextView
android:id="#+id/subtitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#+id/image"
android:layout_below="#+id/title"
/>
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
/>
</RelativeLayout>
By arranging the TextViews to be relative to the ImageView instead of the other way around, the ImageView takes priority for the space, and the text works with the remainder.
this might be help to you
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_linearlayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_margin="1dp"
android:background="#drawable/background" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/layout1label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:singleLine="true"
android:text="1234"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/layout2label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1234_labj hairu iue rel2"
android:textSize="14dp" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" >
<ImageView
android:id="#+id/layout_image"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical"
android:layout_margin="2dp"
android:adjustViewBounds="true"
android:src="#drawable/ic_launcher" />
</LinearLayout>
</LinearLayout>
A little modification to Kirans Code..worked for me
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/layout1label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:singleLine="true"
android:text="Name: BalaVishnu"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1" >
<ImageView
android:id="#+id/layout_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:adjustViewBounds="true"
android:src="#drawable/edit_icon" />
</LinearLayout>

Fit two textView in LinearLayout next to an ImageView

I have this layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
style="#style/fill_parent"
android:background="#color/white"
android:padding="2dip">
<ImageView
android:id="#+id/img_album"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginRight="6dip"
android:layout_centerVertical="true"
android:padding="5dp"
/>
<LinearLayout
style="#style/fill_parent"
android:orientation="horizontal"
android:layout_toRightOf="#id/img_album"
android:layout_centerVertical="true">
<TextView
android:id="#+id/album_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:textColor="#color/black"
android:layout_marginRight="10dp"
/>
<TextView
android:id="#+id/picts_number"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#color/black"
/>
</LinearLayout>
</RelativeLayout>
Which gives me this image:
I dont know why I dont get the title of the album and next the number of picts.
Well, I did something using layout_weight property as:
<TextView
android:id="#+id/album_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:textColor="#color/black"
android:layout_marginRight="10dp"
android:layout_weight="1"
/>
<TextView
android:id="#+id/picts_number"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#color/black"
android:layout_weight="1" />
And I dont really know why, I get now the number, next to the title, as
Could someone tell me:
Why I dont get the number in the 1st scenario, but I do in the 2nd.
How to expand the text all the width of the Linearyout, so the
second Text "Smartphones..." doesnt get stretch, but fits its
parent.
Thanks!
Using the width = 0dip and weigth = 1. I did it!
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
style="#style/fill_parent"
android:background="#color/white"
android:padding="2dip">
<ImageView
android:id="#+id/img_album"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginRight="6dip"
android:layout_centerVertical="true"
android:padding="5dp"
/>
<LinearLayout
style="#style/fill_parent"
android:orientation="horizontal"
android:layout_toRightOf="#id/img_album"
android:layout_centerVertical="true"
android:id="#+id/album_details">
<TextView
android:id="#+id/album_title"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:singleLine="true"
android:textColor="#color/black"
android:layout_marginRight="30dp"
android:textSize="17sp"
android:layout_weight="1"
/>
<TextView
android:id="#+id/picts_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/black"
android:layout_weight="0"
android:textSize="17sp"
android:layout_gravity="right"
android:layout_marginRight="10dp"
/>
</LinearLayout>
</RelativeLayout>
Try to make it with a FrameLayout rather than a RelativeLayout. It's really easier to build your layout with this. Something like this, but with size and style adaptation :
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:padding="2dp">
<ImageView
android:id="#+id/img_album"
android:layout_width="50dp"
android:layout_height="fill_parent"
android:layout_marginRight="6dp"
android:cropToPadding="true"
android:layout_centerVertical="true"
android:padding="5dp"
/>
<TextView
android:id="#+id/album_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:layout_gravity="center"
android:singleLine="true"
android:textColor="#color/black"
android:layout_marginRight="50dp"
/>
<TextView
android:id="#+id/picts_number"
android:layout_width="50dp"
android:layout_height="wrap_content"
android:layout_gravity="right|center_vertical"
android:textColor="#color/black"
/>
</FrameLayout>

Categories

Resources