时间戳

首页 > 解决方案 > 在 ImageView Android-Java 顶部的带有圆角的视图的上部

java - 在 ImageView Android-Java 顶部的带有圆角的视图的上部

问题描述

在此处输入图像描述

我想知道的是如何实现图像中突出显示的部分，而视图的上部具有圆角，而在另一个视图的顶部，该视图作为背景，我尝试遵循 Material Design 的指导方针使用形状或在互联网上寻找类似的东西，但一无所获。

文件

<?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>

这就是我的布局的样子 在此处输入图像描述

标签： javaandroidviewimageviewoverlay

解决方案

为什么在嵌套滚动视图中使用片段？您可以将其替换为自定义视图或包含视图。为此，您需要放置一个带有圆角的可绘制形状，然后将其作为背景添加到您的嵌套片段的第一个父视图中。最后，在嵌套滚动视图中添加一些 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>

推荐阅读