android - Not the same interface display on different screens - android

I'm new in android programming and my problem is that i created a simple calculator interface with some LienarLayouts and the result is not the same on the design display and my physical phone.
The result i get on the design
The result i get on my phone (Galaxy S7)
I couldn't find any solutions for that. For the operators it's some images that i put on different drawable folders (hdpi, xhdpi and xxhdpi).
i will put my xml file here.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/background_light">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="165dp"
android:background="#color/clrBlue"
android:orientation="vertical">
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:gravity="right"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="50dp"
android:text="567"
android:textColor="#android:color/background_light"
android:textSize="45sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="87dp"
android:orientation="horizontal"
android:weightSum="4">
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
android:text="7"
android:textColor="#android:color/black"
android:textSize="30sp" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
android:text="8"
android:textColor="#android:color/black"
android:textSize="30sp" />
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
android:text="9"
android:textColor="#android:color/black"
android:textSize="30sp" />
<ImageButton
android:id="#+id/imageButton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
app:srcCompat="#drawable/divide" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="87dp"
android:orientation="horizontal"
android:weightSum="4">
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
android:text="4"
android:textColor="#android:color/black"
android:textSize="30sp" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
android:text="5"
android:textColor="#android:color/black"
android:textSize="30sp" />
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
android:text="6"
android:textColor="#android:color/black"
android:textSize="30sp" />
<ImageButton
android:id="#+id/imageButton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
app:srcCompat="#drawable/multiply" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="87dp"
android:orientation="horizontal"
android:weightSum="4">
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
android:text="1"
android:textColor="#android:color/black"
android:textSize="30sp" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
android:text="2"
android:textColor="#android:color/black"
android:textSize="30sp" />
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
android:text="3"
android:textColor="#android:color/black"
android:textSize="30sp" />
<ImageButton
android:id="#+id/imageButton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/background_light"
app:srcCompat="#drawable/subtract" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="192dp"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<Button
android:id="#+id/button15"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:background="#color/clrBlue"
android:text="clear"
android:textSize="25sp" />
</LinearLayout>
<Button
android:id="#+id/button3"
android:layout_width="96dp"
android:layout_height="match_parent"
android:background="#android:color/background_light"
android:text="0"
android:textColor="#android:color/black"
android:textSize="30sp" />
<ImageButton
android:id="#+id/imageButton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/background_light"
app:srcCompat="#drawable/add" />
</LinearLayout>
</LinearLayout>
<ImageButton
android:id="#+id/imageButton5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#color/transparent"
android:paddingRight="50dp"
android:paddingTop="125dp"
app:srcCompat="#drawable/equal" />
</RelativeLayout>

The result is different because of the different sizes. At the top of your layout display you will see that Nexus 4 is selected which is of screen size 4.7" and I think Galaxy S7 is of size 5.1".
Also, there can be a difference in density pixels.
You can refer to the android document for different pixel densities.
Support Different Pixel Densities

Relative and Linear layouts is not best choice for create calculator layout. To make this layout try use GridLayout or ConstraintLayout. It will be easier and more reliable solution
Edited

Related

Recyclerview items text look different on different devices

I am working on an activity that has three recyclerviews.
My issue is that the output is different on different devices.
I am testing the app on my real device and on the Android Studio emulators, and the output is right. But I have some customers users who say that the output is wrong.
Here is my screen shot with the right output:
And this is the wrong output on some devices:
I have tried changing text size, but with no success.
I ask you where should I start looking for a solution, at recyclerview or at item view?
EDIT
Activity Layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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="#f2f2f2">
<LinearLayout
android:id="#+id/cabeceraTicket"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/cardview_dark_background"
android:orientation="horizontal">
<TextView
android:id="#+id/txtTicket"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:text="Ticket: "
android:textColor="#color/cardview_light_background"
android:textSize="18sp" />
<TextView
android:id="#+id/txtSalon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:text="Salón: "
android:textColor="#color/cardview_light_background"
android:textSize="18sp" />
<TextView
android:id="#+id/txtMesa"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:text="Mesa:"
android:textColor="#color/cardview_light_background"
android:textSize="18sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/botones"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/cabeceraTicket"
android:orientation="horizontal">
<Button
android:id="#+id/btnTodo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Menu/Ticket" />
<Button
android:id="#+id/btnMenu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Menu" />
<Button
android:id="#+id/btnTicket"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Ticket" />
</LinearLayout>
<LinearLayout
android:id="#+id/botones2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/botones"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:id="#+id/btnRegresar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#009688"
android:text="Salir"
android:textColor="#color/white" />
<Button
android:id="#+id/btnMarchar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#3F51B5"
android:text="Marchar todo"
android:textColor="#color/white" />
</LinearLayout>
<Button
android:id="#+id/btnConectar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:visibility="gone" />
<LinearLayout
android:id="#+id/menus"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/botones2"
android:orientation="vertical">
<TextView
android:id="#+id/textView3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="Menú"
android:textSize="24sp"
android:textStyle="bold" />
<LinearLayout
android:id="#+id/lmenu1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/l0"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_previous" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerViewMenu0"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="10"
android:orientation="horizontal">
</android.support.v7.widget.RecyclerView>
<ImageView
android:id="#+id/r0"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_next" />
</LinearLayout>
<LinearLayout
android:id="#+id/lmenu2"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:visibility="visible">
<ImageView
android:id="#+id/l1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_previous" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerViewMenu1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="10"
android:orientation="horizontal">
</android.support.v7.widget.RecyclerView>
<ImageView
android:id="#+id/r1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_next" />
</LinearLayout>
<LinearLayout
android:id="#+id/lmenu3"
android:layout_width="match_parent"
android:layout_height="80dp"
android:orientation="horizontal"
android:visibility="visible">
<ImageView
android:id="#+id/l2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_previous" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerViewArticulos1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="10"
android:orientation="horizontal">
</android.support.v7.widget.RecyclerView>
<ImageView
android:id="#+id/r2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_next" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/ticket"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/menus"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/titulo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/textView4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="Ticket"
android:textSize="24sp"
android:textStyle="bold" />
<ListView
android:id="#+id/listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/titulo"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:listSelector="#drawable/list_selector"
android:state_activated="true" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
First recyclerview item layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_margin="1dp">
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
app:cardCornerRadius="4dp"
app:cardElevation="1dp"
app:cardMaxElevation="2dp">
<RelativeLayout
android:id="#+id/relative"
android:layout_width="120dp"
android:layout_height="50dp"
android:gravity="center_horizontal|center_vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:id="#+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:layout_marginEnd="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:layout_weight="4"
android:autoSizeMaxTextSize="15sp"
android:autoSizeMinTextSize="8sp"
android:autoSizeTextType="uniform"
android:gravity="center|center_horizontal|center_vertical"
android:padding="12dp"
android:text="Canada"
android:textAllCaps="false"
android:textColor="#color/red_A700"
android:textSize="30sp"
android:textStyle="bold"
app:autoSizeMinTextSize="20sp"
app:fontFamily="sans-serif" />
</LinearLayout>
</RelativeLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
Second recyclerview item layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_margin="1dp">
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
app:cardCornerRadius="4dp"
app:cardElevation="1dp"
app:cardMaxElevation="2dp">
<RelativeLayout
android:id="#+id/relative"
android:layout_width="120dp"
android:layout_height="50dp"
android:gravity="center_horizontal|center_vertical">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:layout_marginEnd="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:autoSizeMaxTextSize="15sp"
android:autoSizeMinTextSize="8sp"
android:autoSizeTextType="uniform"
android:gravity="center|center_horizontal|center_vertical"
android:padding="12dp"
android:text="Canada"
android:textAllCaps="false"
android:textColor="#color/red_A700"
android:textSize="30sp"
android:textStyle="bold"
app:autoSizeMinTextSize="20sp"
app:fontFamily="sans-serif" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
Third recyclerview item layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_margin="1dp">
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
app:cardCornerRadius="4dp"
app:cardElevation="1dp"
app:cardMaxElevation="2dp">
<RelativeLayout
android:id="#+id/relative"
android:layout_width="120dp"
android:layout_height="50dp"
android:gravity="center_horizontal|center_vertical">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:layout_marginEnd="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:autoSizeMaxTextSize="15sp"
android:autoSizeMinTextSize="8sp"
android:autoSizeTextType="uniform"
android:gravity="center|center_horizontal|center_vertical"
android:padding="12dp"
android:text="Canada"
android:textAllCaps="false"
android:textColor="#color/red_A700"
android:textSize="30sp"
android:textStyle="bold"
app:autoSizeMinTextSize="20sp" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
your code contain like this,
<RelativeLayout
android:id="#+id/relative"
android:layout_width="120dp"
android:layout_height="50dp"
android:gravity="center_horizontal|center_vertical"></>
you need to change the item layout fixed length width
I would suggest not to set values for the textsize in your xml at all (either in dp or sp). Let each user choose their preferred textSize by changing the system-wide font size in the device's Settings--->Display--->FontSize.
Just make sure any container for these textViews (the parent layout of each textView) can accommodate textViews of varying sizes. One way this can be accomplished, is by setting the container's width and height values to 'WrapContent' if possible.
My answer should be viewed like a shift in your approach to text sizes in general, rather than a specific answer to a specific problem like the one you are facing. There may well be easier and faster solutions if you just want to quick-fix your current issue.

Android: Place 4 buttons on RelativeLayout

I am trying to place 4 buttons to fill all the relative layout.. I want each button have width and height till the center of the RelativeLayout (with about 2dp space between them).. I don't think that I can explain it very good, so I have made an image and here is the code I have made... Any ideas?? Thank you!! The view right now is:
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TextView"
android:textAlignment="center"
android:textSize="30sp"
android:layout_marginTop="10dp"
android:id="#+id/textView" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/textView"
android:layout_centerHorizontal="true"
android:layout_marginTop="35dp"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:id="#+id/relativeLayout"
android:weightSum="1">
<Button
android:text="Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button"/>
<Button
android:text="Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button2"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"/>
<Button
android:text="Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button3"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<Button
android:text="Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button4"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
Try this code. I used two linear layouts instead of one relative layout
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent">
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="TextView"
android:textAlignment="center"
android:textSize="30sp" />
<LinearLayout
android:orientation="horizontal"
android:id="#+id/relativeLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<Button
android:id="#+id/button"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:text="Button" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
>
<Button
android:id="#+id/button3"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:text="Button" />
<Button
android:id="#+id/button4"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:text="Button" />
</LinearLayout>
</LinearLayout>
<?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:orientation="vertical">
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:text="TextView"
android:textAlignment="center"
android:textSize="30sp" />
<LinearLayout
android:id="#+id/relativeLayout"
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="1"
android:orientation="horizontal">
<Button
android:id="#+id/button"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:padding="5dp"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:padding="5dp"
android:text="Button" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:id="#+id/button3"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:padding="5dp"
android:text="Button" />
<Button
android:id="#+id/button4"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:padding="5dp"
android:text="Button" />
</LinearLayout>
</LinearLayout>
</LinearLayout>

Image from ImageButton is not getting displayed on emulator from Android Studio

In my graphical layout in android studio I'm seeing the images on my imagebutton but when I'm running my app on an emulator the images on the imagebutton do not get displayed.I'm attaching the screenshots of what I'm seeing in my android studio and what I get when I run my app on emulator.
I'm also attaching my xml layout file
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:id="#+id/activity_calc"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.sameer.coolcalc.CalcActivity"
tools:background="#android:color/background_light">
<LinearLayout
android:orientation="vertical"
android:layout_height="match_parent"
android:weightSum="6"
android:layout_width="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:background="#android:color/holo_blue_bright"
android:weightSum="1">
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:inputType="numberDecimal"
android:ems="10"
android:id="#+id/editText4"
android:text="567"
android:textSize="60sp"
android:gravity="center_vertical|end" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:weightSum="4">
<Button
android:text="7"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/button14"
android:layout_weight="1"
android:background="#android:color/background_light"
android:textColor="#android:color/black"
android:textSize="36sp" />
<Button
android:text="8"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/button13"
android:layout_weight="1"
android:textSize="36sp"
android:textColor="#android:color/black"
android:background="#android:color/background_light" />
<Button
android:text="9"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/button12"
android:layout_weight="1"
android:background="#android:color/background_light"
android:textColor="#android:color/black"
android:textSize="36sp" />
<ImageButton
android:layout_height="match_parent"
app:srcCompat="#drawable/divide"
android:id="#+id/imageButton6"
android:layout_weight="1"
android:layout_width="match_parent"
android:background="#android:color/background_light" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<Button
android:text="4"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/button3"
android:layout_weight="1"
android:background="#android:color/background_light"
android:textColor="#android:color/black"
android:textSize="36sp" />
<Button
android:text="5"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/button2"
android:layout_weight="1"
android:background="#android:color/background_light"
android:textColor="#android:color/black"
android:textSize="36sp" />
<Button
android:text="6"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/button"
android:layout_weight="1"
android:background="#android:color/background_light"
android:textColor="#android:color/black"
android:textSize="36sp" />
<ImageButton
android:layout_width="match_parent"
android:layout_height="match_parent"
app:srcCompat="#drawable/multiply"
android:id="#+id/imageButton"
android:layout_weight="1"
android:background="#android:color/background_light" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:weightSum="4">
<Button
android:text="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/button6"
android:layout_weight="1"
android:background="#android:color/background_light"
android:textColor="#android:color/black"
android:textSize="36sp" />
<Button
android:text="2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/button5"
android:layout_weight="1"
android:background="#android:color/background_light"
android:textColor="#android:color/black"
android:textSize="36sp" />
<Button
android:text="3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/button4"
android:layout_weight="1"
android:background="#android:color/background_light"
android:textColor="#android:color/black"
android:textSize="36sp" />
<ImageButton
android:layout_width="match_parent"
android:layout_height="match_parent"
app:srcCompat="#drawable/subtract"
android:id="#+id/imageButton3"
android:layout_weight="1"
android:background="#android:color/background_light" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_height="match_parent"
android:background="#android:color/background_light"
android:layout_width="205dp"
android:gravity="center">
<Button
android:text="clear"
android:id="#+id/button15"
android:background="#android:color/holo_blue_bright"
android:layout_width="170dp"
android:layout_height="50dp"
android:textSize="30sp" />
</LinearLayout>
<Button
android:text="0"
android:layout_height="match_parent"
android:id="#+id/button11"
android:layout_width="103dp"
android:background="#android:color/background_light"
android:textColor="#android:color/black"
android:textSize="36sp" />
<ImageButton
android:layout_width="103dp"
android:layout_height="match_parent"
app:srcCompat="#drawable/add"
android:id="#+id/imageButton5"
android:background="#android:color/background_light" />
</LinearLayout>
</LinearLayout>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#drawable/equal"
android:id="#+id/imageButton7"
android:background="#android:color/transparent"
android:layout_alignParentEnd="true"
android:layout_marginTop="140dp" />
</RelativeLayout>
Use android:src instead of app:srcCompat.This will solve your problem for now.
app:srcCompat comes from Android Support Library, also the support Vector Drawables and Animated Vector Drawables.
If you want to use app:srCompat you should configure your gradle.
android {
defaultConfig {
vectorDrawables.useSupportLibrary = true
}
}
When using AppCompat with ImageView (or subclasses such as ImageButton
and FloatingActionButton), you’ll be able to use the new app:srcCompat
attribute to reference vector drawables (as well as any other drawable
available to android:src)
More info here: https://android-developers.googleblog.com/2016/02/android-support-library-232.html

how can make XML layout compatible with all resoultion?

its Ok with 720x1280 but when run it in 768x1280 not fit with screen so i try all ways like made layout-normal layout-small layout-large and ... but for example i want make this screen for normal-layout so problem is if i make this XML base on 720x1280 or 768x1280 ? or another screen
subset layout-normal or another dpi subset layout-normal what can i do ? if i make this base on 768x1280 when run app in 720x1280 not fix and if make this base on 720x1280 when run app in 768x1280 not fix
so here is my code :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_alignParentBottom="true"
android:id="#+id/rel"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageButton
android:id="#+id/back"
android:background="#drawable/lastb"
android:layout_width="45dp"
android:layout_height="138dp" />
<ImageButton
android:id="#+id/b1"
android:background="#drawable/qwe"
android:layout_marginLeft="2dp"
android:layout_toRightOf="#+id/back"
android:layout_width="65dp"
android:layout_height="68dp" />
<ImageButton
android:id="#+id/b2"
android:background="#drawable/qwe"
android:layout_marginTop="2dp"
android:layout_toRightOf="#id/back"
android:layout_marginLeft="2dp"
android:layout_below="#+id/b1"
android:layout_width="65dp"
android:layout_height="68dp"/>
<ImageButton
android:id="#+id/b3"
android:background="#drawable/qwe"
android:layout_marginLeft="2dp"
android:layout_toRightOf="#+id/b1"
android:layout_width="65dp"
android:layout_height="68dp" />
<ImageButton
android:id="#+id/b4"
android:background="#drawable/qwe"
android:layout_toRightOf="#id/b3"
android:layout_marginLeft="2dp"
android:layout_width="65dp"
android:layout_height="68dp"/>
<ImageButton
android:id="#+id/bb"
android:background="#drawable/df"
android:layout_marginTop="2dp"
android:layout_marginLeft="2dp"
android:layout_toRightOf="#id/b2"
android:layout_below="#id/b3"
android:layout_width="132dp"
android:layout_height="68dp" />
<ImageButton
android:id="#+id/b5"
android:background="#drawable/qwe"
android:layout_toRightOf="#id/b4"
android:layout_marginLeft="2dp"
android:layout_width="65dp"
android:layout_height="68dp" />
<ImageButton
android:id="#+id/b6"
android:background="#drawable/qwe"
android:layout_marginTop="2dp"
android:layout_toRightOf="#id/bb"
android:layout_marginLeft="2dp"
android:layout_below="#+id/b4"
android:layout_width="65dp"
android:layout_height="68dp"/>
<ImageButton
android:id="#+id/forward"
android:background="#drawable/lastf"
android:layout_marginLeft="2dp"
android:layout_toRightOf="#id/b6"
android:layout_width="45dp"
android:layout_height="138dp" />
</RelativeLayout>
</RelativeLayout>
<?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:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="8">
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2">
<ImageButton
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/back" />
</LinearLayout>
<!--Center-->
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="6"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/qwe" />
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/qwe" />
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/qwe" />
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/qwe" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/qwe" />
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:background="#drawable/df" />
<ImageButton
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/qwe" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2">
<ImageButton
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/back" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
Add this in your main relative layout
android:fitsSystemWindows="true"
Use this in your Layout
android:fitsSystemWindows="true"
So, best way to fit all screen resolutions is to use match_parent for your layouts. In your case, you set wrap_content for RelativeLayout and you put views with specific width (android:layout_width="65dp") and layout will wrap around it so if you have big screens it will have space.
This is example how you can fill your screen horizontal with 4 buttons:
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
android:layout_weight="0.25"
android:layout_margin="5dp"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
android:layout_weight="0.25"
android:layout_margin="5dp"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
android:layout_weight="0.25"
android:layout_margin="5dp"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
android:layout_weight="0.25"
android:layout_margin="5dp"/>
</LinearLayout>
With LinearLayout width set to match_parent, you will fit all screens sizes and setting for buttons layout_weight="0.25 you are making button to take 25% of screen. Paste this code so you can get it how it works.

seeing different shape and size buttons on design screen and virtual machine why?

I tried to design some Buttons.
On the design screen they look as I want them to.
After I try to see on the emulator, the sizes and shapes are smaller than design screen.
I want to get the same shape and size on the emulator.
Please help me
How can I this?
Here is the code
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="16dp" >
<LinearLayout
android:layout_above="#+id/socialMediaButtons"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="horizontal" >
<ImageButton
android:src="#drawable/buton"
style="?android:attr/borderlessButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_vertical" />
<ImageButton
android:src="#drawable/buton"
style="?android:attr/borderlessButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="horizontal" >
<ImageButton
android:src="#drawable/buton"
style="?android:attr/borderlessButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
<ImageButton
android:src="#drawable/buton"
style="?android:attr/borderlessButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="horizontal" >
<ImageButton
android:src="#drawable/buton"
style="?android:attr/borderlessButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
<ImageButton
android:src="#drawable/buton"
style="?android:attr/borderlessButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="horizontal" >
<ImageButton
android:src="#drawable/buton"
style="?android:attr/borderlessButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
<ImageButton
android:src="#drawable/buton"
style="?android:attr/borderlessButtonStyle"
android:id="#+id/btn8"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:layout_weight="1" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/socialMediaButtons"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/btnFb"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_weight="1" />
<Button
android:id="#+id/btnTw"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="8dp"
android:layout_weight="1" />
</LinearLayout>
</RelativeLayout>

Categories

Resources