GridLayout collapses on small display
I guess it is a bug of the support version of GridLayout.
Take a look at this (that is currently Assigned): I think it is related to your question about the Nexus 5X font size behavior. In general, I found a lot of related bugs here (related to GridLayout width measurement).
I will try to give you a workaround.
I'm using com.android.support:gridlayout-v7:25.1.1.
I think you can solve your layout problems (both the alignment in older phones and the font size in Nexus 5X) doing in this way:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!--Display row-->
<TextView
android:id="@+id/assignment"
android:text="50 + 40 = 90"
style="@style/Formula"
android:focusable="false"
android:layout_width="match_parent"
android:layout_height="80dp"
tools:ignore="HardcodedText" />
<android.support.v7.widget.GridLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
app:columnCount="4"
app:rowCount="4">
<!-- row with 7-9,+ -->
<LinearLayout
app:layout_gravity="fill_horizontal"
app:layout_columnSpan="4"
android:orientation="horizontal"
app:layout_rowWeight="1">
<Button
android:id="@+id/digit7"
android:text="7"
style="@style/KeypadLeftButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
app:layout_rowWeight="1"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/digit8"
android:text="8"
style="@style/KeypadButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
app:layout_rowWeight="1"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/digit9"
android:text="9"
style="@style/KeypadButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
app:layout_rowWeight="1"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/buttonPlus"
android:text="+"
style="@style/KeypadRightButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:layout_rowWeight="0.5"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
</LinearLayout>
<!--row with 4-6, - -->
<LinearLayout
app:layout_gravity="fill_horizontal"
app:layout_columnSpan="4"
android:orientation="horizontal"
app:layout_rowWeight="1">
<Button
android:id="@+id/digit4"
android:text="4"
style="@style/KeypadLeftButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
app:layout_rowWeight="1"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/digit5"
android:text="5"
style="@style/KeypadButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
app:layout_rowWeight="1"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/digit6"
android:text="6"
style="@style/KeypadButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
app:layout_rowWeight="1"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/buttonMinus"
android:text="-"
style="@style/KeypadRightButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:layout_rowWeight="0.5"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
</LinearLayout>
<!--row with 1-3, * -->
<LinearLayout
app:layout_gravity="fill_horizontal"
app:layout_columnSpan="4"
android:orientation="horizontal"
app:layout_rowWeight="1">
<Button
android:id="@+id/digit1"
android:text="1"
style="@style/KeypadLeftButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
app:layout_rowWeight="1"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/digit2"
android:text="2"
style="@style/KeypadButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
app:layout_rowWeight="1"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/digit3"
android:text="3"
style="@style/KeypadButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
app:layout_rowWeight="1"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/buttonMultiply"
android:text="\u22C5"
style="@style/KeypadRightButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:layout_rowWeight="0.5"
app:layout_columnWeight="1"
tools:ignore="HardcodedText" />
</LinearLayout>
<!--row with 0, backspace and / -->
<LinearLayout
app:layout_gravity="fill_horizontal"
app:layout_columnSpan="4"
android:orientation="horizontal"
app:layout_rowWeight="1"
android:weightSum="4">
<Button
android:id="@+id/digit0"
android:text="0"
style="@style/KeypadLeftButton"
android:layout_width="0dp"
android:layout_height="match_parent"
app:layout_columnWeight="1"
app:layout_gravity="fill_horizontal"
app:layout_rowWeight="1"
tools:ignore="HardcodedText"
android:layout_weight="1"/>
<Button
android:id="@+id/buttonBackspace"
android:text="←"
style="@style/KeypadButton"
android:layout_width="0dp"
android:layout_height="match_parent"
app:layout_gravity="fill_vertical"
app:layout_columnSpan="2"
app:layout_rowWeight="0.5"
app:layout_columnWeight="1"
tools:ignore="HardcodedText"
android:layout_weight="2"/>
<Button
android:id="@+id/buttonDivide"
android:text=":"
style="@style/KeypadRightButton"
android:layout_width="0dp"
android:layout_height="match_parent"
app:layout_rowWeight="0.5"
app:layout_columnWeight="1"
tools:ignore="HardcodedText"
android:layout_weight="1"/>
</LinearLayout>
</android.support.v7.widget.GridLayout>
<!--row with button submit -->
<Button
android:id="@+id/buttonSubmit"
android:text="NEXT"
style="@style/KeypadNextButton"
android:layout_width="match_parent"
android:layout_height="80dp"
app:layout_gravity="fill_horizontal"/>
</LinearLayout>
Basically, what I did is to wrap each group of buttons (four buttons except the last row) in a LinearLayout.
Here you can see how it looks in two phones:
Nexus 5
Samsung galaxy core plus (older)
As you can see, there is a problem in the alignment of the last row. I think you can try to solve the alignment of these buttons playing around with the properties and attributes. Let me know if you want further improvement in this last topic.
Hope this helps.
There are few limitations and Restrictions when using the GridLayout. Here is the Link to DOCUMENTATION
"GridLayout does not provide support for the principle of weight, as defined in weight. In general, it is not therefore possible to configure a GridLayout to distribute excess space in non-trivial proportions between multiple rows or columns ... For complete control over excess space distribution in a row or column; use a LinearLayout subview to hold the components in the associated cell group."
If i was you, i would used Linear layout or Table layout.
Hope this helps!