I have a simple ListView:
<?xml version="1.0" encoding="utf-8"?>
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/overvieList"
android:layout_width="match_parent"
android:layout_height="match_parent" />
and this layout for the ListView items:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:columnCount="2" >
<ImageView
android:id="#+id/overviewItemImage"
android:layout_width="75dp"
android:layout_height="75dp"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_marginRight="5dp"
android:layout_row="0"
android:src="#drawable/ic_launcher" />
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_gravity="left|top"
android:layout_row="0"
android:layout_marginLeft="3dp"
android:layout_marginRight="5dp"
android:columnCount="1"
android:rowCount="3" >
<TextView
android:id="#+id/overviewItemHeader"
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/overviewItemCategory"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_row="1"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textSize="10sp"
android:textStyle="italic" />
<TextView
android:id="#+id/overviewItemText"
android:layout_column="0"
android:layout_gravity="left|top"
android:layout_row="2"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall" />
</GridLayout>
</GridLayout>
</LinearLayout>
Now i use a modified ArrayAdapter to fill the ListView.
ok that works.
But how can I prevent it that the TextViews Content (on the right) goes over the edge??
set layout_marginRight in textview . i hope this will solve your problem
just add a little margin android:layout_marginRight="5dp" to your TextViews
Related
I need to use GridLayout to display two buttons. One and second one with twice the width of other button. I want the NEXT button be twice the width of BACK button and I need a GridLayout.
My source code is as below:
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
style="#style/Calculator.Grid"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:columnCount="3"
app:rowCount="1">
<Button
android:id="#+id/button_back"
android:layout_column="0"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:layout_gravity="left|top"
android:background="#drawable/bg_back_button"
android:text="#string/back"
android:textColor="?attr/colorTextSecondary"
android:textSize="16sp" />
<Button
android:id="#+id/button_next"
android:layout_column="1"
android:layout_columnSpan="2"
android:layout_columnWeight="2"
android:layout_gravity="fill"
android:background="#drawable/bg_next_button"
android:text="#string/next"
android:textColor="?attr/colorTextPrimary"
android:textSize="16sp" />
</GridLayout>
Desired display (NEXT Button should be double the width of BACK button) :
But the result is (Problem) :
If you don't have any problem with Linear Layout as inner container then use this
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
style="#style/Calculator.Grid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:columnCount="3"
app:rowCount="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/button_back"
android:layout_column="0"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:layout_gravity="left|top"
android:background="#drawable/bg_back_button"
android:text="#string/back"
android:textColor="?attr/colorTextSecondary"
android:textSize="16sp"
android:layout_weight="2"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/button_next"
android:layout_column="1"
android:layout_columnSpan="2"
android:layout_columnWeight="2"
android:layout_gravity="fill"
android:background="#drawable/bg_next_button"
android:text="#string/next"
android:textColor="?attr/colorTextPrimary"
android:textSize="16sp"
android:layout_weight="1"/>
</LinearLayout>
</GridLayout>
This is work my bro try this
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:columnCount="3"
android:rowCount="3">
<Button
android:id="#+id/textViewNW"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:layout_gravity="center|fill"
android:layout_rowSpan="1"
android:layout_rowWeight="1"
android:background="#fe4141"
android:text="#string/app_name"
android:textAppearance="?android:attr/textAppearanceLarge" />
<Button
android:id="#+id/textViewNE"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnSpan="2"
android:layout_columnWeight="2"
android:layout_gravity="center|fill"
android:layout_rowSpan="2"
android:layout_rowWeight="2"
android:background="#51f328"
android:text="#string/app_name"
android:textAppearance="?android:attr/textAppearanceLarge" />
</GridLayout>
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
style="#style/Calculator.Grid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:columnCount="3"
app:rowCount="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<Button
android:id="#+id/button_back"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:layout_gravity="left|top"
android:layout_weight="2"
android:background="#drawable/bg_back_button"
android:text="#string/back"
android:textColor="?attr/colorTextSecondary"
android:textSize="16sp" />
<Button
android:id="#+id/button_next"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_columnSpan="2"
android:layout_columnWeight="2"
android:layout_gravity="fill"
android:layout_weight="1"
android:background="#drawable/bg_next_button"
android:text="#string/next"
android:textColor="?attr/colorTextPrimary"
android:textSize="16sp" />
</LinearLayout>
</GridLayout>
The build of my custom list row looks fine, but when I run the app the text fields on the right appear off the screen. API 23.
Here is the listview
<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="match_parent" android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context="com.archerdx.fusionlibrary.FusionList">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/fusionListView">
</ListView>
</RelativeLay
out>
And here is the xml file of the custom rows I'm using
<?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:columnCount="3"
android:rowCount="4"
android:layout_alignParentBottom="true">
<TextView
android:layout_width="384dp"
android:layout_height="60dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Medium Text"
android:id="#+id/fusionName"
android:layout_gravity="fill_horizontal"
android:gravity="center_vertical|center_horizontal"
android:layout_row="0"
android:layout_column="0"
android:layout_columnSpan="3"
android:textColor="#5987c6" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Sources"
android:id="#+id/textView"
android:layout_row="1"
android:layout_column="0"
android:textSize="22dp"
android:layout_gravity="center|left"
android:layout_marginLeft="5dp"
android:layout_marginBottom="10dp"
android:textColor="#000000" />
<TextView
android:layout_width="154dp"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Medium Text"
android:id="#+id/sourceName"
android:layout_weight="0.06"
android:layout_row="1"
android:layout_column="1"
android:layout_columnSpan="2"
android:gravity="right|center_vertical"
android:layout_marginRight="5dp"
android:textColor="#5987c6" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Number of References"
android:id="#+id/textView2"
android:layout_row="2"
android:layout_column="0"
android:textSize="22dp"
android:layout_gravity="center|left"
android:layout_marginLeft="5dp"
android:layout_marginBottom="10dp"
android:textColor="#000000"
android:singleLine="false" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Medium Text"
android:id="#+id/numberOfReferences"
android:layout_gravity="fill_horizontal"
android:layout_row="2"
android:layout_column="1"
android:layout_columnSpan="2"
android:gravity="right|center_vertical"
android:textIsSelectable="true"
android:layout_marginRight="5dp"
android:textColor="#5987c6" />
<Button
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Email"
android:id="#+id/button"
android:layout_weight="0.03"
android:layout_row="3"
android:layout_column="0"
android:layout_marginLeft="20dp" />
</GridLayout>
Give the width to your textviews wrap_content. Or if you want to show in single line the use this in your textviews:
android:ellipsize="end"
android:singleLine="true"
You're using fixed layout widths, weights and a gridview which is never going to be a flexible solution.
Look in to using Linear or Relative layouts instead. There's plenty of info out there.
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>
We are using GridLayout and the firstrow(in bold) is not visible in the below xml.
Only first TextView is not visible.All other texts are visible.
Would be very helpful if someone helped us on this. Thanks in Advance
API level is 21
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:alignmentMode="alignMargins"
android:background="#drawable/gradientbg"
android:columnCount="2"
android:orientation="horizontal"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="?attr/actionBarSize"
android:rowCount="8"
android:useDefaultMargins="true"
tools:context="com.example.truesolution.Page2" >
<TextView
android:id="#+id/display_message2"
android:layout_column="0"
android:layout_columnSpan="2"
android:layout_row="0"
android:text="#string/Sessions"
android:visibility="visible" />
<Button
android:layout_width="278dp"
android:layout_height="72dp"
android:layout_column="0"
android:layout_columnSpan="2"
android:layout_row="1"
android:onClick="sendMessage"
android:text="#string/Value" />
<TextView
android:id="#+id/display_message3"
android:layout_column="0"
android:layout_row="2"
android:textColor="#color/text_color"
android:text="#string/Licensing" />
<Button
android:layout_width="132dp"
android:layout_column="0"
android:layout_row="3"
android:onClick="sendMessage"
android:text="#string/Value" />
<TextView
android:id="#+id/display_message4"
android:layout_column="0"
android:layout_row="4"
android:textColor="#color/text_color"
android:text="#string/DesktopFailures" />
<Button
android:layout_width="131dp"
android:layout_column="0"
android:layout_row="5"
android:onClick="sendMessage"
android:text="#string/Value" />
</GridLayout>
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>