I am currently developing an Android APP and I have ran into a bit of a snag. I am using the drag and drop feature to drag different items around and place them into a different layout. I want the layout where I drop the items to be setup in a grid. Where I can drop an item in the general area and it would snap into that location on the grid.
I have done this, but I feel like it is really clunky and there must be a much easier way to get this accomplished. This is how I have it now..
<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"
tools:context="com.example.david.seniorproject.Controller_LayoutFragment"
tools:showIn="#layout/activity_controller__layout">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".8"
android:id="#+id/linear_layout">
<GridLayout
android:id="#+id/frame_layout"
android:layout_width="0dp"
android:layout_weight=".75"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="0"
android:id="#+id/relative1"
android:layout_column="0"></RelativeLayout>
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="0"
android:id="#+id/relative2"
android:layout_column="1" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="0"
android:id="#+id/relative3"
android:layout_column="2" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="0"
android:id="#+id/relative4"
android:layout_column="3" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="0"
android:id="#+id/relative5"
android:layout_column="4" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="0"
android:id="#+id/relative6"
android:layout_column="5" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="1"
android:id="#+id/relative7"
android:layout_column="0" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="1"
android:id="#+id/relative8"
android:layout_column="1" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="1"
android:id="#+id/relative9"
android:layout_column="2" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="1"
android:id="#+id/relative10"
android:layout_column="3" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="1"
android:id="#+id/relative11"
android:layout_column="4" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="1"
android:id="#+id/relative12"
android:layout_column="5" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="2"
android:id="#+id/relative13"
android:layout_column="0" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="2"
android:id="#+id/relative14"
android:layout_column="1" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="2"
android:id="#+id/relative15"
android:layout_column="2" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="2"
android:id="#+id/relative16"
android:layout_column="3" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="75dp"
android:layout_row="2"
android:id="#+id/relative17"
android:layout_column="4" />
<RelativeLayout
android:layout_width="74dp"
android:layout_height="wrap_content"
android:layout_row="2"
android:id="#+id/relative18"
android:layout_column="5" />
</GridLayout>
<ListView
android:layout_width="0dp"
android:layout_weight=".25"
android:layout_height="wrap_content"
android:id="#+id/listView"
android:backgroundTint="#ff5500" />
</LinearLayout>
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".3"
android:paddingRight="80dp"
android:id="#+id/horizontalScrollView"
android:layout_gravity="center_horizontal" >
<LinearLayout
android:id="#+id/input_items"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<Button
android:layout_width="80dp"
android:text="Test"
android:layout_height="match_parent"
android:background="#drawable/red_circle"
android:id="#+id/button2" /></LinearLayout>
</HorizontalScrollView>
</LinearLayout>
</RelativeLayout>
As you can see, I placed a bunch of layouts evenly throughout the GridLayout. It works, but I feel like there is a better way. The button is just dummy data to test the drag and drop feature.
So my question is, is there a way to setup a gridLayout, or a different Layout to do the same as my setup, without all the extra layouts, or would it be better to just create a custom ViewGroup.
Related
I have a layout like this
<?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="fill_parent"
android:padding="16dp"
android:isScrollContainer="true">
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:text="Button1"
android:layout_gravity="left"
android:layout_row="0"
android:layout_column="0"></Button>
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:text="Button2"
android:layout_gravity="right"
android:layout_row="0"
android:layout_column="1"></Button>
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:text="Button3"
android:layout_gravity="left"
android:layout_row="1"
android:layout_column="0"></Button>
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:text="Button4"
android:layout_gravity="right"
android:layout_row="1"
android:layout_column="1"></Button>
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:text="Button5"
android:layout_gravity="left"
android:layout_row="2"
android:layout_column="0"></Button>
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:text="Button6"
android:layout_gravity="right"
android:layout_row="2"
android:layout_column="1"></Button>
</GridLayout>
Normally I will fit everything into a Relative or Constraint layout. But this time I intentionally made it big so that Button5 and Button6 can't be seen. And what I want is to make the layout scrollable so that the user can scroll up to see the Button5 and Button6?
How can I do it? What layout is to be used? Is there a way to make other layouts scrollale?
You have to do this if you want to scroll your view
<?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="fill_parent"
android:isScrollContainer="true"
android:padding="16dp">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<GridLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:layout_row="0"
android:layout_column="0"
android:layout_gravity="left"
android:text="Button1"></Button>
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:layout_row="0"
android:layout_column="1"
android:layout_gravity="right"
android:text="Button2"></Button>
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:layout_row="1"
android:layout_column="0"
android:layout_gravity="left"
android:text="Button3"></Button>
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:layout_row="1"
android:layout_column="1"
android:layout_gravity="right"
android:text="Button4"></Button>
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:layout_row="2"
android:layout_column="0"
android:layout_gravity="left"
android:text="Button5"></Button>
<Button
android:layout_width="180dp"
android:layout_height="300dp"
android:layout_row="2"
android:layout_column="1"
android:layout_gravity="right"
android:text="Button6"></Button>
</GridLayout>
</ScrollView>
</GridLayout>
I need help...
I was trying to build 3 buttons aligned in 1 row and 3 columns inside of a GridLayout, and looks its working, but I think I haven't done that right, because if change the size of the text inside the button (textSize) the GridLayout and the buttons are going outside of the screen.
I think that I'm setting the layout_witdh and/or layout_height wrong, but I'm not sure.
Can anyone help me? Thanks :)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:background="#drawable/background"
tools:context="com.markus.tssproject.MainActivity">
<RelativeLayout
android:layout_weight="2"
android:layout_width="match_parent"
android:layout_height="match_parent">
<GridLayout
android:layout_width="match_parent"
android:layout_height="110dp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginBottom="5dp"
android:layout_marginRight="5dp"
android:layout_marginLeft="5dp"
android:columnCount="3"
android:rowCount="1">
<Button
android:id="#+id/id0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginRight="3dp"
android:layout_row="0"
android:layout_rowWeight="1"
android:padding="30dp"
android:tag="0"
android:text="test tested testing"
android:textSize="20sp" />
<Button
android:id="#+id/open1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="3dp"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_row="0"
android:layout_rowWeight="1"
android:padding="30dp"
android:tag="1"
android:text="test tested testing"
android:texSize="20sp" />
<Button
android:id="#+id/open2"
android:layout_width="wrap_content"
android:layout_column="2"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_row="0"
android:layout_rowWeight="1"
android:padding="30dp"
android:tag="2"
android:text="teste tested testing"/>
</GridLayout>
</RelativeLayout>
</LinearLayout>
change the following in each button
android:layout_width="0dip"
android:layout_weight ="1"
you can do this in LinearLayout itself, no need of grid layout
Use this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background"
android:orientation="horizontal"
tools:context="com.markus.tssproject.MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="110dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:orientation="horizontal">
<Button
android:id="#+id/id0"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="3dp"
android:layout_weight="1"
android:padding="30dp"
android:tag="0"
android:text="test tested testing"
android:textSize="20sp" />
<Button
android:id="#+id/open1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="3dp"
android:layout_weight="1"
android:padding="30dp"
android:tag="1"
android:texSize="20sp"
android:text="test tested testing" />
<Button
android:id="#+id/open2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="30dp"
android:tag="2"
android:text="teste tested testing" />
</LinearLayout>
I tried to configure a grid layout with 2 rows and 2 columns. But each element here occupies the entire width of the screen, while the second column is outside the screen. Please suggest what am I doing wrong here.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorTheme"
android:orientation="vertical">
<GridLayout
android:id="#+id/moodsGridLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/textView2"
android:columnCount="2"
android:orientation="vertical"
android:rowCount="2">
<ImageButton
android:id="#+id/imageButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="0"
app:srcCompat="#mipmap/brewtv_logos" />
<ImageButton
android:id="#+id/imageButton2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="0"
app:srcCompat="#mipmap/brewtv_logos" />
<ImageButton
android:id="#+id/imageButton3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="1"
app:srcCompat="#mipmap/brewtv_logos" />
<ImageButton
android:id="#+id/imageButton4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="1"
app:srcCompat="#mipmap/brewtv_logos" />
</GridLayout>
</LinearLayout>
Try this:
for Uniform width column and row in Gridlayout use:
android:layout_columnWeight="1"
android:layout_rowWeight="1"
use this layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/color_white"
android:orientation="vertical">
<GridLayout
android:id="#+id/moodsGridLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/textView2"
android:columnCount="2"
android:orientation="vertical"
android:rowCount="2">
<ImageButton
android:id="#+id/imageButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_row="0"
android:layout_rowWeight="1"
android:src="#mipmap/ic_launcher" />
<ImageButton
android:id="#+id/imageButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_row="0"
android:layout_rowWeight="1"
android:src="#mipmap/ic_launcher" />
<ImageButton
android:id="#+id/imageButton3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_row="1"
android:layout_rowWeight="1"
android:src="#mipmap/ic_launcher" />
<ImageButton
android:id="#+id/imageButton4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_row="1"
android:layout_rowWeight="1"
android:src="#mipmap/ic_launcher" />
</GridLayout>
</LinearLayout>
Output:
Im making using a Grid Layout on an app. The Columns work fine but the rows are giving me a problem.
I want 4 rows spread evenly on the image I am using. But for some reason the rows are all bunched up with only the last row ahead of the others. Its my first time using a GridLayout and i cant see what im doing wrong.
<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=".MainActivity">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/imageView"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:src="#drawable/pitch"/>
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:rowCount="4"
android:numColumns="5"
android:id="#+id/formation"
android:layout_alignBottom="#+id/imageView">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gk"
android:layout_row="0"
android:layout_column="1"
android:layout_gravity="center"
android:id="#+id/gk"
android:layout_columnSpan="3" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="DL"
android:layout_row="1"
android:layout_column="0"
android:layout_gravity="center"
android:id="#+id/dl" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="DC"
android:layout_row="1"
android:layout_column="1"
android:layout_gravity="center"
android:id="#+id/dcl" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="DC"
android:layout_row="1"
android:layout_column="3"
android:layout_gravity="center"
android:id="#+id/dcr" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="DR"
android:layout_row="1"
android:layout_column="4"
android:layout_gravity="center"
android:id="#+id/dr" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ML"
android:layout_row="2"
android:layout_column="0"
android:layout_gravity="center"
android:id="#+id/ml" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MC"
android:layout_row="2"
android:layout_column="1"
android:layout_gravity="center"
android:id="#+id/mcl" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MC"
android:layout_row="2"
android:layout_column="3"
android:layout_gravity="center"
android:id="#+id/mcr" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MR"
android:layout_row="2"
android:layout_column="4"
android:layout_gravity="center"
android:id="#+id/mr" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="FC"
android:layout_row="3"
android:layout_column="1"
android:layout_gravity="center"
android:id="#+id/fcl" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="FC"
android:layout_row="3"
android:layout_column="3"
android:layout_gravity="center"
android:id="#+id/fcr" />
</GridLayout>
Suggest you to use linearlayout instead of gridlayout, to set image in background you need to use FrameLayout as in below code,
<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"
tools:context=".MainActivity">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/next"
android:scaleType="centerCrop" />
</FrameLayout>
<LinearLayout
android:id="#+id/formation"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="4">
<LinearLayout
android:id="#+id/formation1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center">
<Button
android:id="#+id/gk"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="Gk" />
</LinearLayout>
<LinearLayout
android:id="#+id/formation2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center">
<Button
android:id="#+id/dl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="DL" />
<Button
android:id="#+id/dcl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="DC" />
<Button
android:id="#+id/dcr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="DC" />
<Button
android:id="#+id/dr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="DR" />
</LinearLayout>
<LinearLayout
android:id="#+id/formation3"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center">
<Button
android:id="#+id/ml"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="ML" />
<Button
android:id="#+id/mcl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="MC" />
<Button
android:id="#+id/mcr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="MC" />
<Button
android:id="#+id/mr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="MR" />
</LinearLayout>
<LinearLayout
android:id="#+id/formation4"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center">
<Button
android:id="#+id/fcl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="FC" />
<Button
android:id="#+id/fcr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="FC" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
hope this is usefull.
Consider instead using a vertical LinearLayout containing horizontal LinearLayouts (or more GridLayouts) for each row. Then each row view can have a layout_weight set to the same value so they are all allocated the same amount of space. In that case also set their layout_height to 0.
You can add:
android:layout_columnWeight="1"
android:layout_rowWeight="1"
in each Button. Like this:
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:rowCount="4"
android:numColumns="5"
android:id="#+id/formation"
android:layout_alignBottom="#+id/imageView">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gk"
android:layout_row="0"
android:layout_column="1"
android:layout_gravity="center"
android:id="#+id/gk"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_columnSpan="3" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="DL"
android:layout_row="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_gravity="center"
android:id="#+id/dl" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="DC"
android:layout_row="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_gravity="center"
android:id="#+id/dcl" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="DC"
android:layout_row="1"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_gravity="centerl"
android:id="#+id/dcr" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="DR"
android:layout_row="1"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_column="4"
android:layout_gravity="center"
android:id="#+id/dr" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ML"
android:layout_row="2"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_gravity="center"
android:id="#+id/ml" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MC"
android:layout_row="2"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_gravity="center"
android:id="#+id/mcl" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MC"
android:layout_row="2"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_gravity="center"
android:id="#+id/mcr" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MR"
android:layout_row="2"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_column="4"
android:layout_gravity="center"
android:id="#+id/mr" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="FC"
android:layout_row="3"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_gravity="center"
android:id="#+id/fcl" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="FC"
android:layout_row="3"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_gravity="center"
android:id="#+id/fcr" />
</GridLayout>
I'm trying to create a GridLayout with 2 columns which will be centered.
My avtual design is:
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
custom:rowCount="4"
custom:columnCount="2"
android:orientation="horizontal">
<TimeTableKeeper.Tile
android:layout_width="75dp"
android:layout_height="75dp"
android:gravity="top|left"
android:background="#00FF00"
custom:color="green"
custom:layout_row="0"
custom:layout_column="0" />
<TimeTableKeeper.Tile
android:layout_width="75dp"
android:gravity="top|left"
android:layout_height="75dp"
android:background="#00FF00"
custom:color="blue"
custom:layout_row="0"
custom:layout_column="1" />
</GridLayout>
And it looks like:
And I would like to have this buttons in the center and perfectly with spacing between them.
Is it possible?
--EDIT:
I have also tried putting it into LinearLayout, without results:
<?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:gravity="center"
android:orientation="vertical">
<GridLayout xmlns:custom="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
custom:rowCount="4"
custom:columnCount="2"
android:orientation="horizontal"
android:gravity="center"
android:layout_gravity="center">
<TimeTableKeeper.Tile
android:layout_width="75dp"
android:layout_height="75dp"
android:background="#00FF00"
custom:color="green"
custom:layout_row="0"
custom:layout_column="0" />
<TimeTableKeeper.Tile
android:layout_width="75dp"
android:layout_height="75dp"
android:background="#00FF00"
custom:color="blue"
custom:layout_row="0"
custom:layout_column="1" />
</GridLayout>
</LinearLayout>
Make the grid wrap around its content horizontally with layout_width="wrap_content" and set it's layout_gravity to center:
<GridLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
// ......
>
From GridLayout documentation:
GridLayout's distribution of excess space is based on priority rather than weight.
(...)
To make a column stretch, make sure all of the components inside it define a gravity.
So apparently you need to set the layout_gravity to android:layout_gravity="top|center" (I have not tested this, but from the documentation it should be along these lines.)
You're almost there. I think this will do the job:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
custom:rowCount="4"
custom:columnCount="2"
android:layout_gravity="center_horizontal"
android:orientation="horizontal">
<TimeTableKeeper.Tile
android:layout_width="75dp"
android:layout_height="75dp"
android:background="#00FF00"
custom:color="green"
custom:layout_row="0"
custom:layout_column="0" />
<TimeTableKeeper.Tile
android:layout_width="75dp"
android:layout_height="75dp"
android:background="#00FF00"
custom:color="blue"
custom:layout_row="0"
custom:layout_column="1" />
</GridLayout>
</FrameLayout>
The code in below solved my problem.
<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">
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_centerHorizontal="true"
android:layout_margin="30dp"
android:columnCount="3"
android:rowCount="4"
android:useDefaultMargins="true">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</GridLayout>
</RelativeLayout>
if you are using a constraint layout use wrap content on the grid layout and create the items inside it. It will be centered to the screen
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/item"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:columnCount="2"
android:useDefaultMargins="true"
/>
copy this example for calculator layout =)
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
>
<!-- android:useDefaultMargins="true" (OPTIONAL) -->
<GridLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:useDefaultMargins="true"
>
<Button
android:layout_column="0"
android:layout_row="0"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="/"/>
<Button
android:layout_column="1"
android:layout_row="0"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="1"/>
<Button
android:layout_column="2"
android:layout_row="0"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="2"/>
<Button
android:layout_column="3"
android:layout_row="0"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="3"/>
<Button
android:layout_column="0"
android:layout_row="1"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="*"/>
<Button
android:layout_column="1"
android:layout_row="1"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="4"/>
<Button
android:layout_column="2"
android:layout_row="1"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="5"/>
<Button
android:layout_column="3"
android:layout_row="1"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="6"/>
<Button
android:layout_column="0"
android:layout_row="2"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="-"/>
<Button
android:layout_column="1"
android:layout_row="2"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="7"/>
<Button
android:layout_column="2"
android:layout_row="2"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="8"/>
<Button
android:layout_column="3"
android:layout_row="2"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="9"/>
<Button
android:layout_column="0"
android:layout_row="3"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="+"/>
<Button
android:layout_column="1"
android:layout_row="3"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="0"/>
<Button
android:layout_column="2"
android:layout_row="3"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="00"/>
<Button
android:layout_column="3"
android:layout_row="3"
android:layout_width="70dp"
android:layout_height="70dp"
android:text="="/>
</GridLayout>
</LinearLayout>