How to make buttons in grid-view horizontally scrollable? - android

Very new to android studio. Trying to make a calculator app in which I can scroll buttons horizontally to get buttons for scientific calculations but it is not working. Here is my xml code.
Then I have added this to activity main but my buttons get disappeared from the screen. Tried changing it a few times changing width and height but nothing seems to be working
<?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:layout_margin="2dp"
android:columnCount="4"
android:rowCount="5">
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:id="#+id/btn_clr"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="C"
android:textColor="#F75D68"
/>
<Button
android:id="#+id/btn_bracket"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="( )" />
<Button
android:id="#+id/btn_prcnt"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="%" />
<Button
android:id="#+id/divide"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="3dp"
android:text="÷" />
<Button
android:id="#+id/multiply"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="3dp"
android:text="X" />
<Button
android:id="#+id/minus"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="2"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="3dp"
android:text="-"/>
<Button
android:id="#+id/plus"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="3"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="3dp"
android:text="+" />
<Button
android:id="#+id/equal"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="4"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="3dp"
android:layout_marginBottom="2dp"
android:background="#2B90FA"
android:text="="
android:textColor="#ffffff" />
<Button
android:id="#+id/one"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="3"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="1"
android:textColor="#333333"
/>
<Button
android:id="#+id/two"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="3"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="2"
android:textColor="#010F14" />
<Button
android:id="#+id/three"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="3"
android:layout_rowWeight="1"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="3"
android:textColor="#333333" />
<Button
android:id="#+id/four"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="2"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="4"
android:textColor="#333333" />
<Button
android:id="#+id/five"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="2"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="5"
android:textColor="#333333" />
<Button
android:id="#+id/six"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="2"
android:layout_rowWeight="1"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="6"
android:textColor="#333333" />
<Button
android:id="#+id/seven"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="7"
android:textColor="#333333" />
<Button
android:id="#+id/eight"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="8"
android:textColor="#333333" />
<Button
android:id="#+id/nine"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:text="9"
android:textColor="#333333" />
<Button
android:id="#+id/d_zero"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="4"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:layout_marginBottom="2dp"
android:text="00"
android:textColor="#333333" />
<Button
android:id="#+id/zero"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="4"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:layout_marginBottom="2dp"
android:text="0"
android:textColor="#333333" />
<Button
android:id="#+id/pt"
style="#style/Buttons"
android:layout_width="0dp"
android:layout_row="4"
android:layout_rowWeight="1"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:layout_marginBottom="2dp"
android:text="."
android:textColor="#333333" />
</HorizontalScrollView>
</GridLayout>

You can use Two-way GridView
look for this

Related

GridLayout look strange on a real Device and perfect on emulator

I've designed a basic calculator in android.
As i designed it, i tested it on Emulator Pixel XL Device (API 28, Screen Resolution 1440x2560 560dpi) and worked fine.
"Emulator Layout"
But when I installed the app in Huawei Honor 4C (Android 6.0) It look hilarious.
"Huawei Honor 4c"
minimumSdkVersion: 21
targetSdkVersion: 28
My Design Code:
<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="vertical"
android:background="#ffeeeeee"
tools:context=".MainActivity" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffffff">
<TextView
android:id="#+id/display"
android:layout_width="match_parent"
android:layout_height="100dp"
android:ems="10"
android:textSize="30sp"
android:gravity="end|bottom"
/>
</LinearLayout>
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="20dp"
android:columnCount="4"
android:rowCount="5">
<Button
android:id="#+id/btnClear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:text="C" />
<Button
android:id="#+id/btnDivid"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:text="/" />
<Button
android:id="#+id/btnMultiplication"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:text="X" />
<Button
android:id="#+id/btnDelete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:text="Delete" />
<Button
android:id="#+id/btn7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:tag="7"
android:text="7" />
<Button
android:id="#+id/btn8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:tag="8"
android:text="8" />
<Button
android:id="#+id/btn9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:tag="9"
android:text="9" />
<Button
android:id="#+id/btnMinus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:text="-" />
<Button
android:id="#+id/btn4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="2"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:tag="4"
android:text="4" />
<Button
android:id="#+id/btn5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="2"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:tag="5"
android:text="5" />
<Button
android:id="#+id/btn6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="2"
android:layout_rowWeight="1"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:tag="6"
android:text="6" />
<Button
android:id="#+id/btnPlus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="2"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:text="+" />
<Button
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="3"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:tag="1"
android:text="1" />
<Button
android:id="#+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="3"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:tag="2"
android:text="2" />
<Button
android:id="#+id/btn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="3"
android:layout_rowWeight="1"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:tag="3"
android:text="3" />
<Button
android:id="#+id/btnEqual"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="3"
android:layout_rowSpan="2"
android:layout_rowWeight="1"
android:layout_column="3"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:background="#color/colorPrimaryDark"
android:onClick="numberClicked"
android:text="=" />
<Button
android:id="#+id/btn0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="4"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnSpan="2"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:tag="0"
android:text="0" />
<Button
android:id="#+id/btnDot"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="4"
android:layout_rowWeight="1"
android:layout_column="2"
android:layout_columnWeight="2"
android:layout_gravity="fill"
android:onClick="numberClicked"
android:tag="."
android:text="." />
</GridLayout>
</LinearLayout>
What are the possible reasons?
I think that this apparent problem is related to the attribute android:supportsRtl="true" and the different API levels of your device/emualtor.
Add in manifest in application tag
<application
android:name=".Application"
android:supportsRtl="true">
If set to true and targetSdkVersion is set to 17 or higher else false
Uninstall app in device and clear project then install to real device again.
If it works give me a thumbs up ..Keep coding :)

Grid layout not getting aligned properly

I am trying to make an app which contains a grid layout. I have to insert 4 buttons in the layout but I am facing problems regarding the alignment of these buttons.
Here is a screenshot and the xml file:
XML file:
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_below="#+id/sumTextView"
android:columnCount="2"
android:rowCount="2">
<Button
android:id="#+id/button0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnWeight="0"
android:layout_gravity="fill"
android:layout_row="0"
android:layout_rowWeight="0"
android:onClick="chooseAnswer"
android:tag="0"
android:text="3"
android:textSize="80sp" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_columnWeight="0"
android:layout_gravity="fill"
android:layout_row="0"
android:layout_rowWeight="0"
android:onClick="chooseAnswer"
android:tag="1"
android:text="3"
android:textSize="80sp" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnWeight="0"
android:layout_gravity="fill"
android:layout_row="1"
android:layout_rowWeight="0"
android:onClick="chooseAnswer"
android:tag="2"
android:text="3"
android:textSize="80sp" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_columnWeight="0"
android:layout_gravity="fill"
android:layout_row="1"
android:layout_rowWeight="0"
android:onClick="chooseAnswer"
android:tag="3"
android:text="3"
android:textSize="80sp" />
</GridLayout>
Can someone tell me what the error is?
Add android:layout_columnWeight="1" and android:layout_rowWeight="1" to all cells.
Like this:
<GridLayout android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_below="#+id/sumTextView"
android:columnCount="2"
android:rowCount="2"
xmlns:android="http://schemas.android.com/apk/res/android">
<Button
android:id="#+id/button0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_gravity="fill"
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:onClick="chooseAnswer"
android:tag="0"
android:text="3"
android:textSize="80sp" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_gravity="fill"
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:onClick="chooseAnswer"
android:tag="1"
android:text="3"
android:textSize="80sp" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_gravity="fill"
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:onClick="chooseAnswer"
android:tag="2"
android:text="3"
android:textSize="80sp" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_gravity="fill"
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:onClick="chooseAnswer"
android:tag="3"
android:text="3"
android:textSize="80sp" />
</GridLayout>

remove extra space between grid components

I am trying to make a calculator app and i used grid for the buttons but when i do that by default there are some margins around the buttons even though i didn't specify one.
yellow part is the grid layout.
Now i tried this method given here. This doesn't seem to work, anyone?
P.s: i am new to android.
Code
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff0000"
android:columnCount="3"
android:rowCount="5"
android:layout_weight="1"
android:useDefaultMargins="false"
android:alignmentMode="alignMargins"
android:rowOrderPreserved="false"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="8dp">
<Button
android:id="#+id/button4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_row="0"
android:layout_rowWeight="1"
android:text="Button"
tools:layout_editor_absoluteX="136dp"
tools:layout_editor_absoluteY="100dp" />
<Button
android:id="#+id/button5"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_row="0"
android:layout_rowWeight="1"
android:text="Button"
tools:layout_editor_absoluteX="116dp"
tools:layout_editor_absoluteY="289dp" />
<Button
android:id="#+id/button6"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_row="0"
android:layout_rowWeight="1"
android:text="Button"
tools:layout_editor_absoluteX="129dp"
tools:layout_editor_absoluteY="255dp" />
<Button
android:id="#+id/button8"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_row="1"
android:layout_rowWeight="1"
android:text="Button"
tools:layout_editor_absoluteX="64dp"
tools:layout_editor_absoluteY="259dp" />
<Button
android:id="#+id/button9"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_row="1"
android:layout_rowWeight="1"
android:text="Button" />
<Button
android:id="#+id/button10"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_row="1"
android:layout_rowWeight="1"
android:text="Button"
tools:layout_editor_absoluteX="129dp"
tools:layout_editor_absoluteY="217dp" />
<Button
android:id="#+id/button12"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_row="2"
android:layout_rowWeight="1"
android:text="Button" />
<Button
android:id="#+id/button13"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_row="2"
android:layout_rowWeight="1"
android:text="Button" />
<Button
android:id="#+id/button14"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_row="2"
android:layout_rowWeight="1"
android:text="Button" />
<Button
android:id="#+id/button16"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_row="3"
android:layout_rowWeight="1"
android:text="Button" />
<Button
android:id="#+id/button17"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_row="3"
android:layout_rowWeight="1"
android:text="Button" />
<Button
android:id="#+id/button18"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_row="3"
android:layout_rowWeight="1"
android:text="Button" />
<Button
android:id="#+id/button20"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_row="4"
android:layout_rowWeight="1"
android:text="Button" />
<Button
android:id="#+id/button21"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_row="4"
android:layout_rowWeight="1"
android:text="Button" />
<Button
android:id="#+id/button22"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_column="2"
android:layout_columnWeight="1"
android:layout_row="4"
android:layout_rowWeight="1"
android:text="Button" />
</GridLayout>

Android Studio : the buttons go outside the screen when shrinking the screen size

I am trying to develop a calculator app and use GridLayout to organize the buttons. When the screen size is larger than 5.5 inches it works perfectly but when I shrink it to less than 5.5 inches all the button goes outside and become very weird. I have attached the xml file of main_activity:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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="#android:color/black"
tools:context="com.example.songwei.calculator.MainActivity">
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/GridLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="8dp"
android:background="#android:color/black"
android:columnCount="4"
android:orientation="horizontal"
android:rowCount="6"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:id="#+id/display"
android:layout_height="wrap_content"
android:layout_columnSpan="4"
android:layout_columnWeight="1"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_rowWeight="1"
android:text="0"
android:textAlignment="viewEnd"
android:textColor="#android:color/white"
android:textSize="50sp" />
<Button
android:id="#+id/btn_clear"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#android:color/darker_gray"
android:text="AC"
android:textSize="30sp" />
<Button
android:id="#+id/btn_root"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#android:color/darker_gray"
android:text="√"
android:textSize="30sp" />
<Button
android:id="#+id/btn_delete"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#android:color/darker_gray"
android:text="del"
android:textSize="30sp" />
<Button
android:id="#+id/btn_division"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#android:color/holo_orange_light"
android:text="÷"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_7"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#696969"
android:text="7"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_8"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#696969"
android:text="8"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_9"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#696969"
android:text="9"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_multiply"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#android:color/holo_orange_light"
android:text="×"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_4"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#696969"
android:text="4"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_5"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#696969"
android:text="5"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_6"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#696969"
android:text="6"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_subtraction"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#android:color/holo_orange_light"
android:text="-"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_3"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#696969"
android:text="3"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_2"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#696969"
android:text="2"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_1"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#696969"
android:text="1"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_add"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#android:color/holo_orange_light"
android:text="+"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_0"
android:layout_columnSpan="2"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#696969"
android:text="0"
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_dot"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#696969"
android:text="."
android:textColor="#android:color/white"
android:textSize="30sp" />
<Button
android:id="#+id/btn_equal"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:backgroundTint="#android:color/holo_orange_light"
android:text="="
android:textColor="#android:color/white"
android:textSize="30sp" />
</GridLayout>
</android.support.constraint.ConstraintLayout>
And what is the mini size of the button and does that affect?
try to make each number of buttons in one viewGroup (Like LinearLayout Horizontal or vertical) this depend on what your calculate looks like.
also use (layout_weight) to make size of view change depend on height and width.
sorry for not writing code.

Android On Screen Buttons overlap with Tabs Application

I am building the layout of my App. It uses the default Tabs layout and the fragment is a Relative Layout with a GridLayout and a TableLayout in it.
At the bottom of the Screen I have a View, which should be fixed to the bottom of the screen with android:layout_alignParentBottom="true" and the Preview shows the layout I intend.
When I run the App in the Simulator the Android On Screen Buttons overlap and cover the lower Part of my App.
Preview:
Simulator:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="0dp"
android:paddingRight="0dp" >
<View
android:layout_width="fill_parent"
android:layout_height="4dp"
android:background="#android:color/white"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_above="#+id/bottomView"
android:id="#+id/spacer"/>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="65dp"
android:columnCount="3"
android:rowCount="2"
android:orientation="vertical"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
android:fitsSystemWindows="true"
android:background="#android:color/white"
android:verticalSpacing="0dp"
android:horizontalSpacing="0dp"
android:id="#+id/bottomView"
>
<TextView
android:text="Punkte ø"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:textSize="18sp" />
<TextView
android:text="15.0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:textSize="24sp" />
N<TextView
android:text="Noten ø"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:textSize="18sp" />
<TextView
android:text="1.0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:textSize="24sp" />
<TextView
android:text="Anzahl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:textSize="18sp" />
<TextView
android:text="5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:textSize="24sp" />
</GridLayout>
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/holo_red_dark"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/textView"
android:layout_above="#id/spacer"
android:id="#+id/red"
>
<GridLayout
android:id="#+id/grid"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="3"
android:layout_below="#+id/textView"
android:layout_above="#id/spacer"
>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="13"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="14"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="15"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="10"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="11"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="12"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="7"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="8"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="9"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="4"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="5"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="6"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="3"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="AC"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="DEL"
android:layout_gravity="fill"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
/>
</GridLayout>
</TableLayout>
<TextView
android:text="15 15 15 15 15"
android:layout_width="wrap_content"
android:layout_height="65dp"
android:id="#+id/textView"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textAppearance="#style/TextAppearance.AppCompat.Display1"
android:textAlignment="center"
android:gravity="center"
android:background="#android:color/darker_gray" />
How can I make the white bottom view stick to the botttom without being overlaped by the naviugation buttons?
Please replace with this code you can see perfect layout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="0dp"
android:paddingRight="0dp">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="65dp"
android:layout_alignParentEnd="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:background="#android:color/darker_gray"
android:gravity="center"
android:text="15 15 15 15 15"
android:textAlignment="center"
android:textAppearance="#style/TextAppearance.AppCompat.Display1" />
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/bottomView"
android:layout_width="fill_parent"
android:layout_height="65dp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:background="#android:color/white"
android:columnCount="3"
android:fitsSystemWindows="true"
android:horizontalSpacing="0dp"
android:orientation="vertical"
android:rowCount="2"
android:verticalSpacing="0dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:text="Punkte ø"
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:text="15.0"
android:textSize="24sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:text="Noten ø"
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:text="1.0"
android:textSize="24sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:text="Anzahl"
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="center"
android:text="5"
android:textSize="24sp" />
</GridLayout>
<View
android:id="#+id/spacer"
android:layout_width="fill_parent"
android:layout_height="4dp"
android:layout_above="#id/bottomView"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:background="#android:color/white" />
<TableLayout
android:id="#+id/red"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#id/textView"
android:layout_above="#id/spacer"
android:background="#android:color/holo_red_dark">
<GridLayout
android:id="#+id/grid"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/spacer"
android:layout_below="#id/textView"
android:columnCount="3">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="13"
android:textColor="#android:color/white" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="14"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="15"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="10"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="11"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="12"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="7"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="8"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="9"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="4"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="5"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="6"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="1"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="2"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="3"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="AC"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="0"
android:textColor="#android:color/white"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_rowWeight="1"
android:background="#color/colorAccent"
android:text="DEL"
android:textColor="#android:color/white"
/>
</GridLayout>
</TableLayout>

Categories

Resources