GridLayout goes beyond

Question

I am trying to reproduce a calculator layout using GridLayout

but this is what i get with the code i tried.

In fact, on the device it gets even worse, it shortens the even larger last equal button, which should span two lines.

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#000000" android:columnCount="5" android:rowCount="2" android:orientation="horizontal" android:padding="5dp"> <Button android:layout_columnSpan="1" android:layout_rowSpan="1" android:text="1" /> <Button android:layout_columnSpan="1" android:layout_rowSpan="1" android:text="2" /> <Button android:layout_columnSpan="1" android:layout_rowSpan="1" android:text="3" /> <Button android:layout_columnSpan="1" android:layout_rowSpan="1" android:text="-" /> <Button android:layout_columnSpan="1" android:layout_rowSpan="2" android:layout_gravity="fill_vertical" android:text="=" /> <Button android:layout_columnSpan="2" android:layout_rowSpan="1" android:layout_gravity="fill_horizontal" android:text="0" /> <Button android:layout_columnSpan="1" android:layout_rowSpan="1" android:text="." /> <Button android:layout_columnSpan="1" android:layout_rowSpan="1" android:text="+" /> <Space android:layout_columnSpan="1" android:layout_rowSpan="1" android:text="-" /> <Space android:layout_columnSpan="1" android:layout_rowSpan="1" android:text="=" /> </GridLayout> 

nonetheless, he continues to go beyond. I tried switching to "android.support.v7.widget.GridLayout" according to this thread:

GridLayout Column Out of the Box

but nothing helped.

Any tips on how to accurately determine the size of the phone?

Answer 1

Change the view to android.support.v7.widget.GridLayout. And also add app: layout_columnWeight for each view and set layout_width to 0dp. Space is not required.

(Tested with Genymotion / VM Nexus Android 5.0 and Nexus 9 with Android 6.0.1)

This is the end result:

 <android.support.v7.widget.GridLayout 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="wrap_content" android:background="#fff" app:columnCount="5" app:rowCount="2" app:orientation="horizontal" android:padding="5dp"> <Button app:layout_columnWeight="1" android:layout_width="0dp" app:layout_columnSpan="1" app:layout_rowSpan="1" android:text="1" /> <Button app:layout_columnWeight="1" android:layout_width="0dp" app:layout_columnSpan="1" app:layout_rowSpan="1" android:text="2" /> <Button app:layout_columnWeight="1" android:layout_width="0dp" app:layout_columnSpan="1" app:layout_rowSpan="1" android:text="3" /> <Button app:layout_columnWeight="1" android:layout_width="0dp" app:layout_columnSpan="1" app:layout_rowSpan="1" android:text="-" /> <Button app:layout_columnWeight="1" android:layout_width="0dp" app:layout_columnSpan="1" app:layout_rowSpan="2" app:layout_gravity="fill_vertical" android:text="=" /> <Button app:layout_columnWeight="1" android:layout_width="0dp" app:layout_columnSpan="2" app:layout_rowSpan="1" app:layout_gravity="fill_horizontal" android:text="0" /> <Button app:layout_columnWeight="1" android:layout_width="0dp" app:layout_columnSpan="1" app:layout_rowSpan="1" android:text="." /> <Button app:layout_columnWeight="1" android:layout_width="0dp" app:layout_columnSpan="1" app:layout_rowSpan="1" android:text="+" /> </android.support.v7.widget.GridLayout>