I have a linearlayout with textview and a imageview inside the gridlayout. I want linearlayout in column1 with the textview and imageview fitting properly in that column of the row. But the image view comes below the textview.
Required result:
My output:
Here is my code:
<GridLayout
android:orientation="horizontal"
android:rowCount="4"
android:columnCount="3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/gridLayoutSuburb">
<LinearLayout
android:orientation="vertical"
android:id="#+id/linearLayout1"
android:layout_row="0"
android:layout_column="0"
android:layout_width="0dp"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:background="#color/blue">
<EditText
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#drawable/edittext"
android:id="#+id/select"
android:textColor="#color/white"
android:textSize="#dimen/_16sdp"
android:textColorHint="#color/white"
android:editable="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:hint="Select "
android:paddingLeft="#dimen/_5sdp"
android:layout_weight="1"
android:singleLine="true" />
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignParentRight="true"
android:layout_centerInParent="true"
android:id="#+id/selectImage"
android:src="#drawable/ic_menu_back" />
</LinearLayout>
</GridLayout>
What am I doing wrong?
change your Linearlayout orientation to android:orientation="horizontal" from android:orientation="vertical"
Use
android:orientation="horizontal"
Instead of
android:orientation="vertical"
CODE
<GridLayout
android:orientation="horizontal"
android:rowCount="4"
android:columnCount="3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/gridLayoutSuburb">
<LinearLayout
android:orientation="horizontal"
android:id="#+id/linearLayout1"
android:layout_row="0"
android:layout_column="0"
android:layout_width="0dp"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:background="#color/blue">
<EditText
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#drawable/edittext"
android:id="#+id/select"
android:textColor="#color/white"
android:textSize="#dimen/_16sdp"
android:textColorHint="#color/white"
android:editable="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:hint="Select "
android:paddingLeft="#dimen/_5sdp"
android:layout_weight="1"
android:singleLine="true" />
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignParentRight="true"
android:layout_centerInParent="true"
android:id="#+id/selectImage"
android:src="#drawable/ic_menu_back" />
</LinearLayout>
</GridLayout>
Replace this attribute value of LinearLayout:
android:orientation="vertical"
To:
android:orientation="horizontal"
Change linear layout orientation to
android:orientation="horizontal"
<GridLayout
android:orientation="horizontal"
android:rowCount="4"
android:columnCount="3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/gridLayoutSuburb">
<LinearLayout
android:orientation="horizontal"
android:id="#+id/linearLayout1"
android:layout_row="0"
android:layout_column="0"
android:layout_width="0dp"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:background="#color/blue">
<EditText
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#drawable/edittext"
android:id="#+id/select"
android:textColor="#color/white"
android:textSize="#dimen/_16sdp"
android:textColorHint="#color/white"
android:editable="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:hint="Select "
android:paddingLeft="#dimen/_5sdp"
android:layout_weight="1"
android:singleLine="true" />
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignParentRight="true"
android:layout_centerInParent="true"
android:id="#+id/selectImage"
android:src="#drawable/ic_menu_back" />
</LinearLayout>
Update Your code to this
<GridLayout
android:orientation="horizontal"
android:rowCount="4"
android:columnCount="3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/gridLayoutSuburb">
<LinearLayout
android:orientation="horizontal"
android:id="#+id/linearLayout1"
android:layout_row="0"
android:layout_column="0"
android:layout_width="0dp"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:background="#color/blue">
<EditText
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#drawable/edittext"
android:id="#+id/select"
android:textColor="#color/white"
android:textSize="#dimen/_16sdp"
android:textColorHint="#color/white"
android:editable="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:hint="Select "
android:paddingLeft="#dimen/_5sdp"
android:layout_weight="1"
android:singleLine="true" />
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignParentRight="true"
android:layout_centerInParent="true"
android:id="#+id/selectImage"
android:src="#drawable/ic_menu_back" />
</LinearLayout>
User android:orientation="horizontal" and give android:width="0dp" so that the text remains in one line and doesn't increase it's width.
<GridLayout
android:orientation="horizontal"
android:rowCount="4"
android:columnCount="3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/gridLayoutSuburb">
<LinearLayout
android:orientation="vertical"
android:id="#+id/linearLayout1"
android:layout_row="0"
android:layout_column="0"
android:layout_width="0dp"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:background="#color/blue">
<EditText
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/edittext"
android:id="#+id/select"
android:textColor="#color/white"
android:textSize="#dimen/_16sdp"
android:textColorHint="#color/white"
android:editable="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:hint="Select "
android:paddingLeft="#dimen/_5sdp"
android:layout_weight="1"
android:singleLine="true" />
<ImageView
android:layout_width="20dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:layout_alignParentRight="true"
android:layout_centerInParent="true"
android:id="#+id/selectImage"
android:src="#drawable/ic_menu_back" />
</LinearLayout>
</GridLayout>
Change linearLayout1 orientation vertical to horizontal and add some margin among them:
<GridLayout
android:orientation="horizontal"
android:rowCount="4"
android:columnCount="3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/gridLayoutSuburb">
<LinearLayout
android:orientation="horizontal"
android:id="#+id/linearLayout1"
android:layout_row="0"
android:layout_column="0"
android:layout_width="0dp"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:background="#color/blue">
<EditText
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#drawable/edittext"
android:id="#+id/select"
android:textColor="#color/white"
android:textSize="#dimen/_16sdp"
android:textColorHint="#color/white"
android:editable="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:hint="Select "
android:paddingLeft="#dimen/_5sdp"
android:layout_weight="1"
android:singleLine="true" />
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginLeft="20dp"
android:layout_alignParentRight="true"
android:layout_centerInParent="true"
android:id="#+id/selectImage"
android:src="#drawable/ic_menu_back" />
</LinearLayout>
</GridLayout>
Related
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#color/colorSlate"
android:orientation="vertical">
<TextView
android:id="#+id/hello"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#5d737e"
android:padding="20dp"
android:text="₹ 250.00"
android:textColor="#color/colorWhite" />
</LinearLayout>
<LinearLayout
android:id="#+id/world"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#color/colorTurquoiseBlue"
android:onClick="#{()->upgradeViewModel.gotoPremimum()}"
android:orientation="horizontal"
android:padding="20dp"
android:weightSum="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".5"
android:fontFamily="sans-serif-medium"
android:letterSpacing="-0.03"
android:text="Go premium"
android:textColor="#color/colorWhite"
android:textSize="14.4sp"
android:textStyle="normal" />
<ImageView
android:layout_width="8dp"
android:layout_height="14dp"
android:layout_gravity="center"
android:layout_weight=".5"
app:srcCompat="#drawable/ic_arrow_white"
/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
This is my xml i am trying to display text horizontally in first linear-layout but when i try to insert another text-view below text-view inside linear-layout i am my first linear-layout get increase not fit with second layout please suggest me how to achieve this i want set text below 200 in given screen
Try this:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/hello"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#5d737e"
android:paddingStart="20dp"
android:paddingTop="10dp"
android:layout_weight="0.5"
android:textSize="15sp"
android:text="₹ 250.00"
/>
<TextView
android:id="#+id/hello1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#5d737e"
android:paddingStart="20dp"
android:paddingBottom="10dp"
android:textSize="15sp"
android:layout_weight="0.5"
android:text="₹ 250.00"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/world"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:onClick="#{()->upgradeViewModel.gotoPremimum()}"
android:orientation="horizontal"
android:padding="20dp"
android:weightSum="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".5"
android:fontFamily="sans-serif-medium"
android:letterSpacing="-0.03"
android:text="Go premium"
android:textSize="14.4sp"
android:textStyle="normal" />
<ImageView
android:layout_width="8dp"
android:layout_height="14dp"
android:layout_gravity="center"
android:layout_weight=".5"
/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Use the layout below . I have changes some attributes to default you can reset them as per your requirement.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#color/blue_end"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/hello"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="₹ 250.00"
android:textColor="#FFFFFF" />
<TextView
android:id="#+id/subscription"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="4dp"
android:text="Subscription"
android:textColor="#FFFFFF" />
</LinearLayout>
<LinearLayout
android:id="#+id/world"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#color/transparent_black"
android:orientation="horizontal"
android:padding="20dp"
android:weightSum="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".5"
android:fontFamily="sans-serif-medium"
android:letterSpacing="-0.03"
android:text="Go premium"
android:textSize="14.4sp"
android:textStyle="normal" />
<ImageView
android:layout_width="8dp"
android:layout_height="14dp"
android:layout_gravity="center"
android:layout_weight=".5"
android:src="#mipmap/ic_launcher" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<LinearLayout
android:padding="10dp"
android:gravity="center"
android:layout_gravity="center"
android:background="#5d737e"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/hello"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="₹ 250.00"
android:textColor="#FFFFFF" />
<TextView
android:id="#+id/hello2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Yearly Subscription"
android:textColor="#FFFFFF" />
</LinearLayout>
<LinearLayout
android:id="#+id/world"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:onClick="#{()->upgradeViewModel.gotoPremimum()}"
android:orientation="horizontal"
android:padding="20dp"
android:weightSum="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".5"
android:fontFamily="sans-serif-medium"
android:letterSpacing="-0.03"
android:text="Go premium"
android:textColor="#000"
android:textSize="14.4sp"
android:textStyle="normal" />
<ImageView
android:layout_width="8dp"
android:layout_height="14dp"
android:layout_gravity="center"
android:layout_weight=".5"
app:srcCompat="#drawable/ic_arrow_white"
/>
</LinearLayout>
</LinearLayout>
try this. :)
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>
I have created this xml:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="11" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal"
android:background="#color/tabs_color">
<Button
android:layout_gravity="start|center"
android:layout_height="30dp"
android:layout_width="30dp"
android:id="#+id/returnButton"
android:layout_marginStart="10dp"
android:layout_marginLeft="10dp"
android:background="#drawable/top_menu_back_selector"/>
<TextView android:id="#+id/textView1"
android:background="#color/black"
android:layout_gravity="center|center"
android:layout_width="180dp"
android:layout_height="match_parent"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/white">
</TextView>
</LinearLayout>
<ListView
android:id="#+id/listView"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="9"
android:fillViewport="true" />
<FrameLayout
android:background="#color/tabs_color"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="0dp"
android:orientation="horizontal">
<Button
android:layout_height="30dp"
android:layout_width="30dp"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:background="#drawable/menu_button_selector"
android:id="#+id/OptionsButton"
android:layout_gravity="start|center_vertical"/>
<Button
android:layout_height="30dp"
android:layout_width="30dp"
android:layout_marginRight="10dp"
android:layout_marginEnd="10dp"
android:background="#drawable/add_button_selector"
android:layout_gravity="end|center_vertical"
android:id="#+id/AddItemButton"/>
</FrameLayout>
</LinearLayout>
But as result i have textview left aligned just right behind button returnButton
So i get my textview position is like:
returnButtonTextView..................
and i want like:
returnButton......TextView............
And this is not works too:
((TextView) listname).setGravity(Gravity.CENTER);
What is wrong?
You should better use RelativeLayout rather than LinearLayout if you need more flexibility when creating layouts.
Replace
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal"
android:background="#color/tabs_color">
<Button
android:layout_gravity="start|center"
android:layout_height="30dp"
android:layout_width="30dp"
android:id="#+id/returnButton"
android:layout_marginStart="10dp"
android:layout_marginLeft="10dp"
android:background="#drawable/top_menu_back_selector" />
<TextView
android:id="#+id/textView1"
android:background="#color/black"
android:layout_gravity="center|center"
android:layout_width="180dp"
android:layout_height="match_parent"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/white" />
</LinearLayout>
with
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal"
android:background="#color/tabs_color">
<Button
android:layout_centerVertical="true"
android:layout_height="30dp"
android:layout_width="30dp"
android:id="#+id/returnButton"
android:layout_marginStart="10dp"
android:layout_marginLeft="10dp"
android:background="#drawable/top_menu_back_selector" />
<TextView
android:id="#+id/textView1"
android:background="#color/black"
android:gravity="center"
android:layout_centerInParent="true"
android:layout_width="180dp"
android:layout_height="match_parent"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/white" />
</RelativeLayout>
Try to change:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal"
android:background="#color/tabs_color">
<Button
android:layout_gravity="start|center"
android:layout_height="30dp"
android:layout_width="30dp"
android:id="#+id/returnButton"
android:layout_marginStart="10dp"
android:layout_marginLeft="10dp"
android:background="#drawable/top_menu_back_selector"/>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"/>
<TextView android:id="#+id/textView1"
android:background="#color/black"
android:layout_gravity="center|center"
android:layout_width="180dp"
android:textAlignment="center"
android:layout_height="match_parent"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/white"/>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"/>
</LinearLayout>
Here is my layout:
<GridLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:columnCount="2"
android:orientation="horizontal"
android:rowCount="2" >
<ImageView
android:id="#+id/img"
android:layout_width="150dp"
android:layout_height="225dp"
android:layout_gravity="left|top"
android:layout_column="0"
android:layout_rowSpan="2"
android:contentDescription="#string/imgdesc" />
<TextView
android:id="#+id/tvName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_column="1"
android:layout_marginLeft="20dp"
android:layout_row="0"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/tvDescription"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_gravity="fill_horizontal"
android:layout_marginLeft="20dp"
android:layout_marginTop="10dp"
android:layout_row="1"/>
</GridLayout>
And here is the result:
As you can see, a part of the text is out the screen and I don't really know how to fix it.
Try to use LinearLayout for your design instead of GridLayout :
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/img"
android:layout_width="150dp"
android:layout_height="225dp"
android:contentDescription="#string/imgdesc"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="5dp"
android:orientation="vertical">
<TextView
android:id="#+id/tvName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/tvDescription"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"/>
</LinearLayout>
</LinearLayout>
just replace below code with your current code, hope this work for you.
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:columnCount="2"
android:orientation="horizontal"
android:rowCount="2" >
<ImageView
android:id="#+id/img"
android:layout_width="100dp"
android:layout_height="225dp"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_rowSpan="2"
android:contentDescription="#string/app_name"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/tvName"
android:layout_width="wrap_content" // this line change
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_gravity="left"
android:layout_marginLeft="20dp"
android:layout_row="0"
android:ems="5" //this line added
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/tvDescription"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:ems="5"
android:layout_gravity="fill_horizontal"
android:layout_marginLeft="20dp"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_row="1" />
</GridLayout>
Note: there can be a many ways to do the same.
try below code, it will work
<?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" >
<ImageView
android:id="#+id/img"
android:layout_width="150dp"
android:layout_height="225dp"
android:layout_gravity="left|top"
android:layout_column="0"
android:layout_rowSpan="2"
android:scaleType="fitXY"
android:contentDescription="test" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/tvName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_column="1"
android:layout_marginLeft="20dp"
android:layout_row="0"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/tvDescription"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_gravity="fill_horizontal"
android:layout_marginLeft="20dp"
android:layout_marginTop="10dp"
android:layout_row="1"/>
</LinearLayout>
</LinearLayout>
I have a ListView in my Activity.
Each ListView item use (in a array adapter) this layout:
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_gravity="top"
android:background="#ffffff"
android:columnCount="2"
android:rowCount="1" >
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_margin="5dp"
android:layout_row="0"
android:rowCount="3" >
<TextView
android:id="#+id/settingsHeader"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_row="0"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/settingsContent"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_row="2"
android:layout_width="match_parent"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall" />
</GridLayout>
<Switch
android:id="#+id/settingsToggle"
android:layout_column="1"
android:layout_marginRight="5dp"
android:layout_gravity="center_vertical|right"
android:layout_row="0"/>
</GridLayout>
But my problem is, that the layout is beyond the right margin. I think it's because the TextView settingsContent is not wrap the text. How can i solve this problem?
Add these piece of code to your TextView settingsContent.
android:ellipsize="end"
android:ems="9"
android:lines="1"
android:singleLine="true"
Set the width of your 1st GridLayout to 'fill_parent'.
XML will be like this:
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="top"
android:background="#ffffff"
android:columnCount="2"
android:rowCount="1" >
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_margin="5dp"
android:layout_row="0"
android:rowCount="3" >
<TextView
android:id="#+id/settingsHeader"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_row="0"
android:ellipsize="end"
android:ems="9"
android:lines="1"
android:singleLine="true"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/settingsContent"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_row="2"
android:layout_width="match_parent"
android:ellipsize="end"
android:ems="9"
android:lines="1"
android:singleLine="true"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall" />
</GridLayout>
<Switch
android:id="#+id/settingsToggle"
android:layout_column="1"
android:layout_marginRight="5dp"
android:layout_gravity="center_vertical|right"
android:layout_row="0"/>
This will might help you.
Try this..
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="top"
android:background="#ffffff"
android:columnCount="2"
android:rowCount="1" >
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_margin="5dp"
android:layout_row="0"
android:rowCount="3" >
<TextView
android:id="#+id/settingsHeader"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_row="0"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/settingsContent"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_row="2"
android:layout_width="match_parent"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall" />
</GridLayout>
<Switch
android:id="#+id/settingsToggle"
android:layout_column="1"
android:layout_marginRight="5dp"
android:layout_gravity="center_vertical|right"
android:layout_row="0"/>
You might try the following code which will give you the same look..
<?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:gravity="center">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal"
android:layout_margin="5dp">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.8"
android:gravity="center"
android:orientation="vertical"
android:layout_margin="2dp">
<TextView
android:id="#+id/settingsHeader"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="3dp"
android:textStyle="bold"
android:textColor="#696969"
android:layout_gravity="center"
android:text="hello how are you guys"/>
<TextView
android:id="#+id/settingsContent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="3dp"
android:textColor="#9C9A9A"
android:layout_gravity="center"
android:text="I am fine wat abt u"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.2"
android:gravity="center|right"
android:orientation="vertical"
android:layout_margin="5dp">
<Switch
android:id="#+id/settingsToggle"
android:layout_width="60dp"
android:layout_height="25dp"
android:layout_margin="3dp"
android:textColor="#FFFFFF"
android:gravity="center"
android:text="Error"
android:background="#942B2A"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>