Is it possible to programmatically remove a row from a GridLayout?
The layout below consists of 3 rows (phone, cell, email).
In the code it can determine if there is no cell phone number. If not then I don't want to display the 2nd row at all.
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:mapbox="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/individual_gridlayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:alignmentMode="alignBounds"
android:columnCount="4"
android:columnOrderPreserved="false"
android:rowCount="3">
<ImageButton
android:id="#+id/phone_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="0"
android:background="#null"
android:src="#drawable/ic_phone_enabled" />
<ImageButton
android:id="#+id/voip_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_row="0"
android:background="#null"
android:src="#drawable/ic_voip_enabled" />
<TextView
android:id="#+id/phone_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_margin="10dp"
android:layout_row="0"
android:text="My Phone number"
android:textColor="#color/black"
android:textSize="#dimen/text_size_small"
tools:text="phone" />
<ImageButton
android:id="#+id/message_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="1"
android:background="#null"
android:src="#drawable/ic_textsms_enabled" />
<ImageButton
android:id="#+id/cell_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="1"
android:background="#null"
android:src="#drawable/ic_phone_enabled" />
<ImageButton
android:id="#+id/voip2_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_row="1"
android:background="#null"
android:src="#drawable/ic_voip_enabled" />
<TextView
android:id="#+id/cell_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_margin="10dp"
android:layout_row="1"
android:text="My Cell number"
android:textColor="#color/black"
android:textSize="#dimen/text_size_small"
tools:text="phone" />
<ImageButton
android:id="#+id/email_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="2"
android:background="#null"
android:src="#drawable/ic_email_enabled" />
<TextView
android:id="#+id/email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_columnSpan="3"
android:layout_margin="10dp"
android:layout_row="2"
android:text="someone#state.nm.us"
android:textColor="#color/black"
android:textSize="#dimen/text_size_small"
tools:text="email" />
</GridLayout>
Grid layout works with cells, not with rows, it gives you the cappability to change the amount of columns.
It will be more suitable to remove the undesired cells using something like:
GridLayout grid = findViewById(R.id.grid);
Button btnInGrid = findViewById(R.id.someButtonInsideTheGrid);
grid.removeView(btnInGrid);
There are a number of ways to solve this problem. What I've ended up doing is creating another layout file without the row in question and then based on some condition, choose the appropriate layout. Then in the code you also have to use this condition to dance around the components that may not be there.
if (some condition) {
view = inflater.inflate(R.layout.mylayout, container, false);
}
else {
view = inflater.inflate(R.layout.mylayout_no_cell, container, false);
}
mylayout_no_cell.xml
<GridLayout xmlns:mapbox="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/individual_gridlayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:alignmentMode="alignBounds"
android:columnCount="4"
android:columnOrderPreserved="false"
android:rowCount="2">
<ImageButton
android:id="#+id/phone_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="0"
android:background="#null"
android:src="#drawable/ic_phone_enabled" />
<ImageButton
android:id="#+id/voip_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_row="0"
android:background="#null"
android:src="#drawable/ic_voip_enabled" />
<TextView
android:id="#+id/phone_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_margin="10dp"
android:layout_row="0"
android:text="My Phone number"
android:textColor="#color/black"
android:textSize="#dimen/text_size_small"
tools:text="phone" />
<ImageButton
android:id="#+id/email_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="1"
android:background="#null"
android:src="#drawable/ic_email_enabled" />
<TextView
android:id="#+id/email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_columnSpan="3"
android:layout_margin="10dp"
android:layout_row="1"
android:text="someone#state.nm.us"
android:textColor="#color/black"
android:textSize="#dimen/text_size_small"
tools:text="email" />
</GridLayout>
Related
Is there a way to have a fullscreen row with elements on Android?
I tried to do it with table, GridView and linear, but I'm struggling with it since quite a time now and couldn't find a post that helped me.
I just made a small picture of what I'd like to do:
http://i.imgur.com/W0oTyaC.png
In short point:
Label and Button should just be as big as their content and fit to the biggest label in the column
The button should stick on the right side
The label should stick on the left side
The textbox should just fill the leftover space between label/button, but in the case of bigger content, it shouldn't "kick out" the button on the right...
My last try was the GridView, which looks a kind of acceptable, but not really.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Add nutrition part"
android:id="#+id/textView"
android:layout_column="0"
android:layout_row="0"
android:layout_columnSpan="1"
android:layout_rowSpan="1" />
<TextView
android:text="Selected part"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView15"
android:layout_column="0"
android:layout_row="1"
android:layout_columnSpan="1"
android:layout_rowSpan="1" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="text"
android:text=""
android:enabled="false"
android:id="#+id/dialogMakeMealPartNutrition"
android:layout_column="1"
android:layout_row="1"
android:layout_columnSpan="1"
android:layout_rowSpan="1"
android:layout_gravity="fill_horizontal" />
<Button
android:text="Find nutrition"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/buttonMakeMealPartFindNutrition"
android:layout_column="2"
android:layout_row="1"
android:layout_columnSpan="1"
android:layout_rowSpan="1" />
<TextView
android:text="Gram"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView17"
android:layout_column="0"
android:layout_row="2"
android:layout_columnSpan="1"
android:layout_rowSpan="1" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="numberDecimal"
android:id="#+id/dialogMakeMealPartGram"
android:layout_column="1"
android:layout_row="2"
android:layout_columnSpan="1"
android:layout_rowSpan="1"
android:layout_gravity="fill_horizontal" />
<Button
android:text="Abort"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/dialogMakeMealPartButtonAbort"
android:layout_column="0"
android:layout_row="3"
android:layout_columnSpan="1"
android:layout_rowSpan="1" />
<Button
android:text="Add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/dialogMakeMealPartButtonAdd"
android:layout_column="1"
android:layout_row="3"
android:layout_columnSpan="1"
android:layout_rowSpan="1" />
</GridLayout>
</ScrollView>
</RelativeLayout>
EDIT:
The ConstraintLayout did a quite good job for my purpose - thanks for good hint Luca:
Code looks like this now:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#FFFFFF">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Add nutrition part"
android:id="#+id/headline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:text="Selected part"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView15"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/buttonMakeMealPartFindNutrition" />
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:inputType="text"
android:text=""
android:enabled="false"
android:id="#+id/dialogMakeMealPartNutrition"
app:layout_constraintStart_toEndOf="#+id/textView15"
app:layout_constraintEnd_toStartOf="#+id/buttonMakeMealPartFindNutrition"
app:layout_constraintTop_toTopOf="#+id/buttonMakeMealPartFindNutrition" />
<Button
android:text="Find nutrition"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/buttonMakeMealPartFindNutrition"
app:layout_constraintTop_toBottomOf="#+id/headline"
app:layout_constraintStart_toEndOf="#+id/dialogMakeMealPartNutrition"
app:layout_constraintEnd_toEndOf="parent" />
<TextView
android:text="Gram"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView17"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/dialogMakeMealPartNutrition" />
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:inputType="numberDecimal"
android:id="#+id/dialogMakeMealPartGram"
app:layout_constraintStart_toStartOf="#+id/dialogMakeMealPartNutrition"
app:layout_constraintEnd_toEndOf="#+id/dialogMakeMealPartNutrition"
app:layout_constraintTop_toBottomOf="#+id/dialogMakeMealPartNutrition" />
<Button
android:text="Abort"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/dialogMakeMealPartButtonAbort"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/dialogMakeMealPartGram" />
<Button
android:text="Add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/dialogMakeMealPartButtonAdd"
app:layout_constraintStart_toEndOf="#+id/dialogMakeMealPartButtonAbort"
app:layout_constraintTop_toBottomOf="#+id/dialogMakeMealPartGram" />
</android.support.constraint.ConstraintLayout>
</ScrollView>
</RelativeLayout>
You can use a ConstraintLayout to achieve this, here you can find an explanation of it.
Your layout file should look like this:
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Add nutrition part"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<TextView
android:id="#+id/textView15"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Selected part"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView"/>
<EditText
android:id="#+id/dialogMakeMealPartNutrition"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:enabled="false"
android:inputType="text"
app:layout_constraintStart_toEndOf="#+id/textView15"
app:layout_constraintEnd_toStartOf="#+id/buttonMakeMealPartFindNutrition"
app:layout_constraintTop_toBottomOf="#+id/textView"
android:text=""/>
<Button
android:id="#+id/buttonMakeMealPartFindNutrition"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#+id/textView"
app:layout_constraintStart_toEndOf="#+id/dialogMakeMealPartNutrition"
app:layout_constraintEnd_toEndOf="parent"
android:text="Find nutrition"/>
...
</android.support.constraint.ConstraintLayout>
I am having problems with a GridLayout. In the layout below, phone_image and voip_image overlap and I don't want them to. phone_image is in column 0 and voip_image is in column 2.
SSCCE on Github
https://github.com/emnrd-ito/LayoutDemo
<HorizontalScrollView
android:id="#+id/container_scroll_view"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<GridLayout xmlns:mapbox="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/individual_gridlayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:alignmentMode="alignBounds"
android:columnCount="4"
android:columnOrderPreserved="false"
android:rowCount="7">
<ImageView
android:id="#+id/division_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnSpan="3"
android:layout_margin="10dp"
android:layout_row="0"
android:layout_rowSpan="3"
android:background="#null"
android:layout_gravity="center_horizontal"
android:src="#mipmap/ic_launcher" />
<TextView
android:id="#+id/employee_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_margin="10dp"
android:layout_row="0"
android:text="Nobody Lastname"
tools:text="name" />
<TextView
android:id="#+id/division"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_margin="10dp"
android:layout_row="1"
android:text="My Division"
tools:text="division" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_margin="10dp"
android:layout_row="2"
android:text="My Title"
tools:text="position" />
<TextView
android:id="#+id/address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_margin="10dp"
android:layout_row="3"
android:text="123 Sesame St."
tools:text="address" />
<TextView
android:id="#+id/city_state"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_margin="10dp"
android:layout_row="4"
android:text="mycity, mystate"
tools:text="city,state" />
<TextView
android:id="#+id/phone_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_margin="10dp"
android:layout_row="5"
android:text="(555) 555-5555"
tools:text="phone" />
<TextView
android:id="#+id/email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_columnSpan="3"
android:layout_margin="10dp"
android:layout_row="6"
android:text="someone#somewhere.com"
tools:text="email" />
<ImageButton
android:id="#+id/directions_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="4"
android:background="#null"
android:src="#drawable/ic_directions_enabled" />
<ImageButton
android:id="#+id/phone_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="5"
android:background="#null"
android:src="#drawable/ic_phone_enabled" />
<ImageButton
android:id="#+id/voip_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_row="5"
android:background="#null"
android:src="#drawable/ic_voip_enabled" />
<ImageButton
android:id="#+id/email_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="6"
android:background="#null"
android:src="#drawable/ic_email_enabled" />
</GridLayout>
</HorizontalScrollView>
Edit:
I tried using Space like so:
<android.support.v4.widget.Space
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_column="1"
android:layout_row="5"/>
It seems to insert about 1/2 column, whereas using the blank image inserts a whole column. There may be parameters to play within the Space component though.
You can try to give android:maxWidth property to both voipImage and phoneImage ImageButtons, like this:
<ImageButton
android:id="#+id/phone_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="5"
android:maxWidth="96dp"
android:background="#null"
android:src="#drawable/ic_phone_enabled" />
<ImageButton
android:id="#+id/voip_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_row="5"
android:maxWidth="96dp"
android:background="#null"
android:src="#drawable/ic_voip_enabled" />
Update
The above changes are not necessary. I think that to solve your problem you can simply change the layout_column property of voip_image like this:
android:layout_column="1"
Hope this can help
One solution is to create a blank image and put it in the drawable folder.
Then use it to take up space in the layout like so:
<ImageButton
android:id="#+id/phone_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="5"
android:background="#null"
android:src="#drawable/ic_phone_enabled" />
<ImageButton
android:id="#+id/blank_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="5"
android:background="#null"
android:src="#drawable/ic_blank" />
<ImageButton
android:id="#+id/voip_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_row="5"
android:background="#null"
android:src="#drawable/ic_voip_enabled" />
I tried to customize the layout of my ListView so I made up the following layout file:
<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="100dp"
tools:context=".workout.WorkoutPlanFragment"
android:paddingRight="10dp"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/edit_view"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_column="0"
android:layout_row="0"
android:visibility="gone">
<ImageView
android:layout_width="40dp"
android:layout_height="wrap_content"
android:src="#drawable/ic_delete"
android:layout_column="0"
android:layout_row="0"
android:layout_rowSpan="3"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:layout_marginRight="15dp"
android:layout_marginLeft="15dp"
android:id="#+id/image_view_delete_workout_plan"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/image_view_move_down"
android:src="#drawable/ic_down" android:layout_gravity="center_vertical"
android:layout_marginRight="15dp"/>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/image_view_move_up"
android:src="#drawable/ic_up" android:layout_gravity="center_vertical"
android:layout_marginRight="15dp"/>
</LinearLayout>
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/workout_plan_fragment" android:layout_column="1" android:layout_row="0">
<ImageView
android:layout_width="93dp"
android:layout_height="match_parent"
android:src="#drawable/img_workout"
android:id="#+id/imageView5"
android:layout_column="0" android:layout_row="0" android:layout_rowSpan="3"
android:paddingBottom="4dp" android:paddingTop="4dp" android:layout_marginRight="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Someting"
android:alpha="1"
android:id="#+id/text_view_plan_name" android:layout_gravity="center_vertical"
android:layout_column="1" android:layout_row="0"
android:textColor="#5a70ff"
android:textSize="26dp" android:layout_marginTop="5dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="asdf"
android:id="#+id/text_view_anz_exercises" android:layout_row="1" android:layout_column="1"
android:layout_rowWeight="0.1" android:alpha="1" android:textSize="15dp"/>
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall" android:text="blablablablablabla"
android:id="#+id/text_view_last_workout" android:layout_row="2" android:layout_column="1"
android:layout_marginBottom="5dp"/>
</GridLayout>
When I use this layout on a Fragment or just check it in the design tab it looks totally fine like this:
But as soon as I apply this layout to a ListView item it turns out looking like that:
I already tried replacing the GridLayout by a LinearLayout or something like that but it always looks like that...
How can I make the ListView item look like the designed Layout?
Try this code.
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingRight="10dp" />
<LinearLayout
android:id="#+id/edit_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_column="0"
android:layout_row="0"
android:orientation="horizontal"
android:visibility="gone">
<ImageView
android:id="#+id/image_view_delete_workout_plan"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_row="0"
android:layout_rowSpan="3"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/image_view_move_down"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="15dp"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/image_view_move_up"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="15dp"
android:src="#drawable/ic_launcher" />
</LinearLayout>
<GridLayout
android:id="#+id/workout_plan_fragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="0">
<ImageView
android:id="#+id/imageView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_marginRight="10dp"
android:layout_row="0"
android:layout_rowSpan="3"
android:paddingBottom="4dp"
android:paddingTop="4dp"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/text_view_plan_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_gravity="center_vertical"
android:layout_marginTop="5dp"
android:layout_row="0"
android:alpha="1"
android:text="Someting"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#5a70ff"
android:textSize="26dp" />
<TextView
android:id="#+id/text_view_anz_exercises"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="1"
android:layout_rowWeight="0.1"
android:alpha="1"
android:text="asdf"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textSize="15dp" />
<TextView
android:id="#+id/text_view_last_workout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_marginBottom="5dp"
android:layout_row="2"
android:text="blablablablablabla"
android:textAppearance="?android:attr/textAppearanceSmall" />
</GridLayout>
I have the following xml file to define my layout for an activity in android:
<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:columnCount="10"
android:background="#cccccc"
>
<TextView
android:text="#string/new_title"
android:textSize="32dip"
android:layout_columnSpan="10"
android:layout_gravity="center_horizontal"
android:id="#+id/textTitleEdit"
android:layout_row="0"
android:layout_column="0" />
<TextView
android:text="#string/new_descr"
android:textSize="16dip"
android:layout_columnSpan="8"
android:layout_gravity="left"
android:id="#+id/textSubTitleEdit"
android:layout_row="1"
android:layout_column="0" />
<TextView
android:text="#string/new_name"
android:layout_gravity="right"
android:layout_row="2"
android:layout_column="0"
/>
<EditText
android:ems="7"
android:singleLine="true"
android:inputType="textCapWords"
android:id="#+id/new_name"
android:layout_row="2"
android:layout_column="1" />
<ImageButton
android:src="#mipmap/ic_backspace_black_24dp"
android:id="#+id/clear_line"
android:layout_row="2"
android:minHeight="15dp"
android:minWidth="15dp"
android:maxHeight="15dp"
android:maxWidth="15dp"
/>
<ImageButton
android:src="#mipmap/ic_search_black_24dp"
android:id="#+id/new_search"
android:layout_row="2"
android:minHeight="15dp"
android:minWidth="15dp"
android:maxHeight="15dp"
android:maxWidth="15dp"
/>
_____________
<TextView
android:text="#string/new_label"
android:layout_gravity="right"
android:layout_row="3"
android:layout_column="0" />
<EditText
android:ems="7"
android:singleLine="true"
android:inputType="textCapWords"
android:id="#+id/new_label"
android:layout_row="3"
android:layout_column="1" />
______
<TextView
android:layout_column="0"
android:text="#string/new_price"
android:layout_gravity="right"
/>
<EditText
android:ems="7"
android:singleLine="true"
android:id="#+id/new_price"
android:inputType="numberDecimal"
android:layout_row="4"
android:layout_column="1" />
<TextView
android:layout_column="0"
android:text="#string/new_offset"
android:layout_gravity="right"
android:layout_row="6" />
<EditText
android:ems="7"
android:singleLine="true"
android:id="#+id/new_offset"
android:inputType="number"
android:layout_row="6"
android:layout_column="1" />
<SeekBar
android:layout_row="7"
android:layout_width="150dp"
android:max="10"
android:id="#+id/seek_offset"
android:layout_column="1"
style="#android:style/Widget.Holo.SeekBar"/>
<Space
android:layout_row="4"
android:layout_column="0"
android:layout_columnSpan="3"
android:layout_gravity="fill"
/>
<Button
android:text="Cancel"
android:id="#+id/new_cancel"
android:background="#color/colorPrimaryDark"
android:layout_row="10"
android:layout_column="0"
/>
<Button
android:text="Ok"
android:id="#+id/new_ok"
android:background="#color/colorPrimaryLight"
android:layout_row="10"
android:layout_column="8"
/>
</GridLayout>
This works fine, and I see something like in the following image (although I might have defined nonesense in this xml, or something incorrect, as I am a beginning beginner in Android...)
However, I am reusing this layout in some other activity and replace the text of the textView with the id textSubTitleEdit by a shorter text. As a consequence, the Ok-Button is shifted to the left, and is no longer at its place in the lower right corner.
Is there something wrong with my layout? How can the length of a TextView affect the position of a button?
The problem here is that you are using a GridLayout to place all your views in the layout.
If you want your buttons to stick to the bottom, one on each side of the screen, you may consider adding a RelativeLayout above your GridLayout, and move your button there as follows:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#cccccc"
>
<GridLayout
android:id="#+id/grid"
android:layout_margin="8dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_above="#+id/new_cancel"
android:alignmentMode="alignBounds"
android:columnCount="10"
android:columnOrderPreserved="false"
android:useDefaultMargins="true">
<TextView
android:id="#+id/textTitleEdit"
android:layout_column="0"
android:layout_columnSpan="10"
android:layout_gravity="center_horizontal"
android:layout_row="0"
android:text="#string/new_title"
android:textSize="32dip"/>
....
<SeekBar
android:id="#+id/seek_offset"
style="#android:style/Widget.Holo.SeekBar"
android:layout_width="150dp"
android:layout_column="1"
android:layout_row="7"
android:max="10"/>
<Space
android:layout_column="0"
android:layout_columnSpan="3"
android:layout_gravity="fill"
android:layout_row="4"
/>
</GridLayout>
<Button
android:id="#+id/new_cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:background="#color/colorPrimaryDark"
android:text="Cancel"
/>
<Button
android:id="#+id/new_ok"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:background="#color/colorPrimaryLight"
android:text="Ok"
/>
</RelativeLayout>
The GridView I made results in the following layout:
How to set up the layout to avoid the out of screen widgets?
The Grid Layout itself is ok and filling the screen but the children do not and overlapp.
here the XML of the gridlayout:
<GridLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:columnCount="4"
android:rowCount="3">
<ImageButton
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/circular"
android:layout_row="0"
android:layout_column="3"
android:layout_rowSpan="3" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/textView4"
android:layout_row="1"
android:layout_column="0" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="numberDecimal"
android:ems="10"
android:id="#+id/editText"
android:layout_row="1"
android:layout_column="1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/textView5"
android:layout_row="1"
android:layout_column="2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/textView10"
android:layout_row="2"
android:layout_column="0" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="numberDecimal"
android:ems="10"
android:id="#+id/editText2"
android:layout_row="2"
android:layout_column="1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/textView11"
android:layout_row="2"
android:layout_column="2" />
</GridLayout>