ImageView Android-Java 頂部的圓角視圖的上部

Question

我想知道的是如何實現圖像中突出顯示的部分，而視圖的上部具有圓角，而在另一個視圖的頂部，該視圖充當背景，我嘗試遵循 Material Design 的指導方針使用形狀或在互聯網上尋找類似的東西，但一無所獲。

XML 文件

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/background_light"
    android:theme="@style/gymTheme"
    android:fitsSystemWindows="true"
    >

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/main.appbar"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        android:fitsSystemWindows="true"
        >
    <com.google.android.material.appbar.CollapsingToolbarLayout
        android:id="@+id/main.collapsing"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        android:fitsSystemWindows="true"
        app:contentScrim="?attr/colorPrimary"
        app:expandedTitleMarginStart="48dp"
        app:expandedTitleMarginEnd="64dp"
        >

        <ImageView
            android:id="@+id/backdrop"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop"
            android:fitsSystemWindows="true"
            android:src="@drawable/aagym"
            app:layout_collapseMode="parallax"
            />

        <com.google.android.material.appbar.MaterialToolbar
            android:id="@+id/main.toolbar"
            android:layout_width="match_parent"
            app:title="@string/search_hint"
            android:layout_height="?attr/actionBarSize"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            app:layout_collapseMode="pin"
            />
    </com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>

<androidx.core.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">


    <fragment
        android:id="@+id/nav_host_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:defaultNavHost="true"
        app:navGraph="@navigation/specific" />


</androidx.core.widget.NestedScrollView>

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:layout_margin="10dp"
    android:src="@drawable/ic_baseline_favorite_border_24"
    app:layout_anchor="@id/main.appbar"
    app:layout_anchorGravity="bottom|right|end"
    />



<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"

    android:layout_marginBottom="10dp"
    app:menu="@menu/gym_details_menu"
    app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
    />
</androidx.coordinatorlayout.widget.CoordinatorLayout>

這就是我的布局的樣子

Answer 1

為什么在嵌套滾動視圖中使用片段？ 您可以將其替換為自定義視圖或包含視圖。 為此，您需要放置一個帶有圓角的可繪制形狀，然后將其作為背景添加到您的嵌套片段的第一個父視圖中。 最后，在嵌套滾動視圖中添加一些 margin-top，以便您可以隱藏圓角的空白區域。 請記住，您父母的視圖不能只有形狀下的孩子的背景顏色。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@color/colorAccent" />
    <corners
        android:bottomLeftRadius="0dp"
        android:bottomRightRadius="0dp"
        android:topLeftRadius="40dp"
        android:topRightRadius="40dp" />
</shape>