如何在android坐标布局中半重叠frameLyout
我要设计这样的布局：
我在AppBarLayout中使用过，并且尝试了以下代码：
<android.support.design.widget.CoordinatorLayout 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:layout_marginTop="-200dp">-->
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="@android:color/transparent"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/banner_detail_course_img"
android:visibility="visible">
<!--<ImageView-->
<!--android:layout_width="match_parent"-->
<!--android:layout_height="match_parent"-->
<!--android:src="@drawable/banner_detail_course_img"-->
<!--android:scaleType="centerCrop"/>-->
<TextView
android:id="@+id/header_txtTitleCourse"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_marginTop="60dp"
android:layout_marginEnd="10dp"
android:text="@{courseItem.title}"
android:textColor="#fff"
android:textSize="30sp" />
<TextView
android:id="@+id/header_txtShortDescCourse"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtTitleCourse"
android:layout_alignParentEnd="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:text="@{courseItem.shortDescription}"
android:textColor="#fff"
android:textSize="15sp" />
<TextView
android:id="@+id/header_txtRate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtShortDescCourse"
android:layout_alignParentEnd="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:background="@drawable/rounded_background_textview"
android:drawableEnd="@drawable/ic_star"
android:drawablePadding="5dp"
android:text="@{String.valueOf(courseItem.ratingAvg)}"
android:textColor="#fff"
android:textSize="15sp" />
<TextView
android:id="@+id/header_txtEnrolled"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtShortDescCourse"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:layout_toStartOf="@+id/header_txtRate"
android:background="@drawable/rounded_background_textview"
android:drawableEnd="@drawable/ic_user_enrolled"
android:drawablePadding="5dp"
android:text="@{courseItem.numberEnroll.concat(@string/space).concat(@string/number_enroll)}"
android:textColor="#fff"
android:textSize="15sp" />
<TextView
android:id="@+id/header_txtDuration"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtRate"
android:layout_alignParentEnd="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:background="@drawable/rounded_background_textview"
android:drawableEnd="@drawable/ic_play_icon"
android:drawablePadding="5dp"
android:text="@{courseItem.duration.concat(@string/space).concat(@string/label_hour)}"
android:textColor="#fff"
android:textSize="15sp" />
<TextView
android:id="@+id/header_txtInstructor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtRate"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:layout_toStartOf="@+id/header_txtDuration"
android:background="@drawable/rounded_background_textview"
android:text="@{@string/txt_label_instructor.concat(@string/space).concat(courseItem.instructorName)}"
android:textColor="#fff"
android:textSize="15sp" />
<TextView
android:id="@+id/header_txtUpdate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtInstructor"
android:layout_alignParentEnd="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:background="@drawable/rounded_background_textview"
android:text="@{@string/last_update_course.concat(@string/space).concat(courseItem.updateDate)}"
android:textColor="#FFF"
android:textSize="15sp" />
<FrameLayout
android:id="@+id/flPreview"
android:layout_width="260dp"
android:layout_height="220dp"
android:layout_below="@+id/header_txtUpdate"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp">
<ImageView
android:id="@+id/imgPreview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="@drawable/preview_video_view"
app:imageUrl="@{courseItem.imagePreview}" />
<ImageView
android:id="@+id/imgPlayButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="@drawable/ic_play_video" />
<TextView
android:id="@+id/header_txtPreview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|bottom"
android:layout_marginBottom="20dp"
android:text="@string/txt_show_preview_video"
android:textColor="#FFF"
android:textSize="20sp"
android:textStyle="bold" />
</FrameLayout>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/imgBack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="20dp"
android:src="@drawable/ic_back_press" />
<ImageView
android:id="@+id/imgFavorit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:layout_toEndOf="@+id/imgShare"
android:src="@drawable/ic_favorite_toolbar" />
<ImageView
android:id="@+id/imgShare"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="20dp"
android:src="@drawable/ic_share" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView 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:layout_gravity="fill_vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/txtCurrentPrice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_marginTop="30dp"
android:layout_marginEnd="20dp"
android:text="@{courseItem.price}"
android:textSize="30sp"
android:textStyle="bold" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
我的输出布局是：
我想成为AppBarLayout中ID为flPreview的FrameLayout预览的一半。
1 个答案:
答案 0 :(得分：1)
请检查此代码。这可能对您有帮助
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="500dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimary"
android:layout_marginBottom="100dp"> <!--just set the half of the size of the frame layout-->
<!--your content here-->
</RelativeLayout>
<FrameLayout
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:background="@color/colorPrimaryDark">
<!--your frame layout content here-->
</FrameLayout>
</RelativeLayout>
</RelativeLayout>
在您的代码上尝试一下。
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:layout_marginTop="-200dp">-->
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="500dp"
android:background="#fff"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="@android:color/transparent"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="visible">
<!--<ImageView-->
<!--android:layout_width="match_parent"-->
<!--android:layout_height="match_parent"-->
<!--android:src="@drawable/banner_detail_course_img"-->
<!--android:scaleType="centerCrop"/>-->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryDark"
android:layout_marginBottom="110dp">
<!-- android:background="@drawable/banner_detail_course_img"-->
<TextView
android:id="@+id/header_txtTitleCourse"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_marginTop="60dp"
android:layout_marginEnd="10dp"
android:text="courseItem.title"
android:textColor="#fff"
android:textSize="30sp" />
<TextView
android:id="@+id/header_txtShortDescCourse"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtTitleCourse"
android:layout_alignParentEnd="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:text="courseItem.shortDescription"
android:textColor="#fff"
android:textSize="15sp" />
<TextView
android:id="@+id/header_txtRate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtShortDescCourse"
android:layout_alignParentEnd="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:drawablePadding="5dp"
android:text="courseItem ratingAvg"
android:textColor="#fff"
android:textSize="15sp" />
<!--android:drawableEnd="@drawable/ic_star"
android:background="@drawable/rounded_background_textview"-->
<TextView
android:id="@+id/header_txtEnrolled"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtShortDescCourse"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:layout_toStartOf="@+id/header_txtRate"
android:drawablePadding="5dp"
android:text="@{courseItem.numberEnroll.concat(@string/space).concat(@string/number_enroll)}"
android:textColor="#fff"
android:textSize="15sp" />
<!--android:background="@drawable/rounded_background_textview"
android:drawableEnd="@drawable/ic_user_enrolled"-->
<TextView
android:id="@+id/header_txtDuration"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtRate"
android:layout_alignParentEnd="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:drawablePadding="5dp"
android:text="@{courseItem.duration.concat(@string/space).concat(@string/label_hour)}"
android:textColor="#fff"
android:textSize="15sp" />
<!-- android:background="@drawable/rounded_background_textview"
android:drawableEnd="@drawable/ic_play_icon"-->
<TextView
android:id="@+id/header_txtInstructor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtRate"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:layout_toStartOf="@+id/header_txtDuration"
android:text="@{@string/txt_label_instructor.concat(@string/space).concat(courseItem.instructorName)}"
android:textColor="#fff"
android:textSize="15sp" />
<!-- android:background="@drawable/rounded_background_textview"-->
<TextView
android:id="@+id/header_txtUpdate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/header_txtInstructor"
android:layout_alignParentEnd="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:text="@{@string/last_update_course.concat(@string/space).concat(courseItem.updateDate)}"
android:textColor="#FFF"
android:textSize="15sp" />
<!-- android:background="@drawable/rounded_background_textview"-->
</RelativeLayout>
<FrameLayout
android:id="@+id/flPreview"
android:layout_width="260dp"
android:layout_height="220dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="@color/colorPrimary"
android:layout_marginTop="20dp">
<ImageView
android:id="@+id/imgPreview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
/>
<!-- android:src="@drawable/preview_video_view"-->
<ImageView
android:id="@+id/imgPlayButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@color/colorPrimary"
/>
<!-- android:src="@drawable/ic_play_video"-->
<TextView
android:id="@+id/header_txtPreview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|bottom"
android:layout_marginBottom="20dp"
android:text="txt_show_preview_video"
android:textColor="#FFF"
android:textSize="20sp"
android:textStyle="bold" />
</FrameLayout>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/imgBack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="20dp"
/>
<!-- android:src="@drawable/ic_back_press"-->
<ImageView
android:id="@+id/imgFavorit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:layout_toEndOf="@+id/imgShare"
/>
<!--android:src="@drawable/ic_favorite_toolbar"-->
<ImageView
android:id="@+id/imgShare"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_marginTop="10dp"
android:layout_marginEnd="20dp"
/>
<!-- android:src="@drawable/ic_share"-->
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView 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:layout_gravity="fill_vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/txtCurrentPrice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_marginTop="30dp"
android:layout_marginEnd="20dp"
android:text="@{courseItem.price}"
android:textSize="30sp"
android:textStyle="bold" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
只需根据您的项目更改值和图像
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？