如何實現android frame-Layout功能

Question

嗨，我是Android新手，在我的應用程序中，我正在使用FrameLayout

我的問題是我想像下面的圖1那樣設計屏幕

但是根據我的代碼，我變得像下面的圖片2，請幫助我該怎么做

我的代碼：

<?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="wrap_content"
        android:layout_marginLeft="30dp"
        android:layout_marginRight="30dp"
        android:layout_marginTop="250dp"
        android:orientation="horizontal"
        android:weightSum="3">

        <FrameLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent">

            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_centerInParent="true"
                android:background="@color/splash"
                android:padding="5dp">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_launcher" />

            </FrameLayout>

            <TextView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:layout_gravity="top|right"
                android:layout_marginRight="-20dp"
                android:layout_marginTop="-10dp"
                android:background="@android:color/holo_orange_dark"
                android:gravity="center"
                android:text="1"
                android:textColor="@android:color/white" />

        </FrameLayout>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1" />

        <FrameLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_marginLeft="30dp">

            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_centerInParent="true"
                android:background="@color/splash"
                android:padding="5dp">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_launcher" />
            </FrameLayout>

            <TextView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:layout_gravity="top|right"
                android:layout_marginRight="-20dp"
                android:layout_marginTop="-10dp"
                android:background="@android:color/holo_orange_dark"
                android:gravity="center"
                android:text="2"
                android:textColor="@android:color/white" />

        </FrameLayout>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1" />

        <FrameLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_marginLeft="30dp">

            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_centerInParent="true"
                android:background="@color/splash"
                android:padding="5dp">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_launcher" />

            </FrameLayout>

            <TextView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:layout_gravity="top|right"
                android:layout_marginRight="-20dp"
                android:layout_marginTop="-10dp"
                android:background="@android:color/holo_orange_dark"
                android:gravity="center"
                android:text="3"
                android:textColor="@android:color/white" />

        </FrameLayout>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1" />

        <FrameLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_marginLeft="30dp">

            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_centerInParent="true"
                android:background="@color/splash"
                android:padding="5dp">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_launcher" />

            </FrameLayout>

            <TextView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:layout_gravity="top|right"
                android:layout_marginRight="-20dp"
                android:layout_marginTop="-10dp"
                android:background="@android:color/holo_orange_dark"
                android:gravity="center"
                android:text="4"
                android:textColor="@android:color/white" />

        </FrameLayout>

    </LinearLayout>

</LinearLayout>

此搜索： -

圖像2： -

Answer 1

也許這樣的事情將是一個很好的起點：

（您可以檢查以下問題以創建循環文本視圖： Android：創建循環TextView嗎？ ）

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:padding="10dp"
            android:src="@drawable/ic_launcher" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top|right"
            android:background="@android:color/holo_orange_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="1"
            android:textColor="@android:color/white" />
    </FrameLayout>

    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:padding="10dp"
            android:src="@drawable/ic_launcher" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top|right"
            android:background="@android:color/holo_orange_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="1"
            android:textColor="@android:color/white" />
    </FrameLayout>


    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:padding="10dp"
            android:src="@drawable/ic_launcher" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top|right"
            android:background="@android:color/holo_orange_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="1"
            android:textColor="@android:color/white" />
    </FrameLayout>


    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:padding="10dp"
            android:src="@drawable/ic_launcher" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top|right"
            android:background="@android:color/holo_orange_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="1"
            android:textColor="@android:color/white" />
    </FrameLayout>

</LinearLayout>

Answer 2

希望這可以幫助：

                <RelativeLayout
                    android:id="@+id/layout1"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">


                    <ImageView
                        android:id="@+id/image"
                        android:layout_width="60dp"
                        android:layout_height="50dp"
                        android:layout_centerHorizontal="true"
                        android:gravity="center"
                        android:src="@drawable/ic_launcher" />


                    <TextView
                        android:id="@+id/badge_notification_1"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentTop="true"
                        android:layout_toRightOf="@+id/image"
                        android:background="@drawable/badge_item_count"
                        android:text="3"
                        android:textColor="#FFF"
                        android:textSize="16sp" />
                </RelativeLayout>

將此添加到您的可繪制文件夾：

名稱：badge_item_count

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="6dp" />
    <solid android:color="@color/orange" />
    <stroke
        android:width="2dip"
        android:color="#FFF" />
    <padding
        android:bottom="5dp"
        android:left="5dp"
        android:right="5dp"
        android:top="5dp" />

</shape>