时间戳

首页 > 解决方案 > 如何使视图与图片中的视图重叠

java - 如何使视图与图片中的视图重叠

问题描述

我有一个如图所示的设计，那么如何在xml中做一个ui如下所示： 在此处输入图像描述

我的团队代码 xml：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">

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

        <LinearLayout
            android:id="@+id/layout1"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_gravity="top"
            android:orientation="horizontal">

        </LinearLayout>

        <LinearLayout
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_below="@+id/layout1"
            android:background="@color/teal_200">

        </LinearLayout>
    </FrameLayout>


</RelativeLayout>

谁能给我解决方案来设计这件作品。谢谢。

标签： javaandroidxmlkotlinandroid-framelayout

解决方案

这里使用translation属性是代码

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

    <LinearLayout
        android:id="@+id/layout1"
        android:layout_width="200dp"
        android:layout_height="100dp"
        android:background="@color/purple_700"
        android:orientation="horizontal"
        android:padding="3dp"<!-- Set the thickness of the border -->
        android:translationX="50dp"
        android:translationY="25dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/teal_200"
            android:orientation="horizontal"></LinearLayout>
    </LinearLayout>

    <LinearLayout
        android:layout_width="200dp"
        android:layout_height="100dp"
        android:background="@color/purple_700">

    </LinearLayout>

</FrameLayout>

推荐阅读