1

I created a home page for my app with tile design but my last tile gets half hidden in devices smaller than 5 inches. Please Help!! I think the app is not resizing in these devies the tiles dont shrink . I am a beginner in Android app development.

The below code is my activity_home.xml and this is the screenshot of what my app looks in an 5 inch device.

this is the screenshot of what my app looks in an 5 inch device

You can see the last tile is under the upper two. Why is this happening?

     <?xml version="1.0" encoding="utf-8"?>
   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Home"
android:orientation="vertical"
android:padding="10dp"
android:background="@color/backgroundcolor"
android:gravity="center"
>
<LinearLayout
    android:clipChildren="false"
    android:gravity="center"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <android.support.v7.widget.CardView
        android:foreground="?android:attr/selectableItemBackground"
        android:clickable="true"

        android:layout_width="160dp"
        android:layout_height="190dp"
        android:layout_margin="10dp">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:gravity="center">
        <ImageView
            android:layout_width="64dp"
            android:layout_height="64dp"
            android:background="@drawable/cerclebackgroundpurple"
            android:src="@drawable/ic_attach_money_black_24dp"
            android:padding="10dp"
            />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textStyle="bold"
            android:layout_marginTop="10dp"
            android:text="Banking"/>
        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="@color/lightgray"
            android:layout_margin="10dp"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="Check your bank activities"
            android:padding="5dp"
            android:textColor="@android:color/darker_gray"
            />
    </LinearLayout>
    </android.support.v7.widget.CardView>
    <android.support.v7.widget.CardView
        android:foreground="?android:attr/selectableItemBackground"
        android:clickable="true"
        android:layout_width="160dp"
        android:layout_height="190dp"
        android:layout_margin="10dp">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:gravity="center">
            <ImageView
                android:layout_width="64dp"
                android:layout_height="64dp"
                android:background="@drawable/cerclebackgroundpink"
                android:src="@drawable/ic_lightbulb_outline_black_24dp"
                android:padding="10dp"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textStyle="bold"
                android:layout_marginTop="10dp"
                android:text="Ideas"/>
            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@color/lightgray"
                android:layout_margin="10dp"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="Check your bank activities"
                android:padding="5dp"
                android:textColor="@android:color/darker_gray"
                />
        </LinearLayout>
    </android.support.v7.widget.CardView>
</LinearLayout>

<LinearLayout
    android:clipChildren="false"
    android:gravity="center"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <android.support.v7.widget.CardView
        android:foreground="?android:attr/selectableItemBackground"
        android:clickable="true"
        android:layout_width="160dp"
        android:layout_height="190dp"
        android:layout_margin="10dp">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:gravity="center">
            <ImageView
                android:layout_width="64dp"
                android:layout_height="64dp"
                android:background="@drawable/cerclebackgroundgreen"
                android:src="@drawable/ic_control_point_black_24dp"
                android:padding="10dp"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textStyle="bold"
                android:layout_marginTop="10dp"
                android:text="Add"/>
            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@color/lightgray"
                android:layout_margin="10dp"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="Check your bank activities"
                android:padding="5dp"
                android:textColor="@android:color/darker_gray"
                />
        </LinearLayout>
    </android.support.v7.widget.CardView>
    <android.support.v7.widget.CardView
        android:layout_width="160dp"
        android:layout_height="190dp"
        android:layout_margin="10dp">
        <LinearLayout
            android:foreground="?android:attr/selectableItemBackground"
            android:clickable="true"

            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:gravity="center">
            <ImageView
                android:layout_width="64dp"
                android:layout_height="64dp"
                android:background="@drawable/cerclebackgroundyello"
                android:src="@drawable/ic_attach_file_black_24dp"
                android:padding="10dp"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textStyle="bold"
                android:layout_marginTop="10dp"
                android:text="Links"/>
            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@color/lightgray"
                android:layout_margin="10dp"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="Check your bank activities"
                android:padding="5dp"
                android:textColor="@android:color/darker_gray"
                />
        </LinearLayout>
    </android.support.v7.widget.CardView>
</LinearLayout>

<LinearLayout
    android:clipChildren="false"
    android:gravity="center"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <android.support.v7.widget.CardView
        android:layout_width="340dp"
        android:layout_height="150dp"
        android:layout_margin="10dp">
        <LinearLayout
            android:foreground="?android:attr/selectableItemBackground"
            android:clickable="true"

            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:gravity="center">
            <ImageView
                android:layout_width="64dp"
                android:layout_height="64dp"
                android:background="@drawable/cerclebackgroundpurple"
                android:src="@drawable/ic_wifi_black_24dp"
                android:padding="10dp"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textStyle="bold"
                android:layout_marginTop="10dp"
                android:text="Add"/>
            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@color/lightgray"
                android:layout_margin="10dp"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="Check your bank activities"
                android:padding="5dp"
                android:textColor="@android:color/darker_gray"
                />
        </LinearLayout>
    </android.support.v7.widget.CardView>

</LinearLayout>

Phantômaxx
  • 37,901
  • 21
  • 84
  • 115
  • Hi, you need to do this: https://stackoverflow.com/questions/32860815/how-to-define-dimens-xml-for-every-different-screen-size-in-android – Syed Hamza Hassan Sep 23 '18 at 05:44

2 Answers2

0

There are multiple options you can achieve this.

1.You can put it in a scrollview if you want fixed size. You can make scroll bar invisible.

  1. You can use weight to divide heights evenly.

  2. You can define heights from dimens.xml and create a separate dimens file to define heights for smaller screens.

PK Gupta
  • 822
  • 10
  • 20
0

i solved this problem by adding

app:layout_constrainedHeight="true"
android:maxHeight="640dp"

to o an imageview in the xml. that way that imageview will reduce its size when there is not enough space for everything. maybe this helps you.

quealegriamasalegre
  • 2,887
  • 1
  • 13
  • 35