在android中创建重叠工具栏配置文件图像

时间:2017-09-13 13:09:05

标签: android layout toolbar overlap

enter image description here

如何创建这种类型的布局,我不知道是否可以通过图像视图创建重叠工具栏,如上图所示。

1 个答案:

答案 0 :(得分:0)

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/activity_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/white">

      <RelativeLayout
          android:id="@+id/header"
          android:layout_width="match_parent"
          android:layout_height="?actionBarSize"
          android:paddingLeft="10dp"
          android:paddingRight="10dp"
          android:background="@drawable/header_bg"
          android:layout_gravity="top">


        <ImageButton
            android:id="@+id/btnBack"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:tint="@color/colorPrimary"
            android:layout_alignParentLeft="true"
            android:layout_centerVertical="true"
            android:src="@drawable/back_icon"
            android:background="?attr/selectableItemBackgroundBorderless"/>

        <ImageButton
            android:id="@+id/btnNevMenu"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:src="@drawable/ic_nev_menu"
            android:scaleType="fitXY"
            android:background="?attr/selectableItemBackgroundBorderless"/>

      </RelativeLayout>


      <FrameLayout
          android:id="@+id/container"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout_marginTop="-2dp"
          android:layout_below="@+id/header"/>

      <com.github.siyamed.shapeimageview.CircularImageView
          android:id="@+id/iv_Profile"
          android:layout_width="75dp"
          android:layout_height="75dp"
          app:siBorderWidth="1dp"
          app:siBorderColor="@color/colorPrimary"
          android:layout_marginTop="15dp"
          android:layout_centerHorizontal="true"
          android:layout_gravity="top|center"
          android:src="@drawable/photo"/>

    </RelativeLayout>


// and this frameLayout inside fragment or activity where you want.

            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="@dimen/_220sdp"
                android:layout_marginBottom="50dp"
                android:layout_gravity="top"
                app:layout_collapseMode="parallax">

                <ImageView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:src="@drawable/photo"
                    android:scaleType="centerCrop"/>

                <ImageView
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/_150sdp"
                    android:layout_marginLeft="@dimen/_16sdp"
                    android:layout_marginRight="@dimen/_16sdp"
                    android:src="@drawable/ic_triangle"
                    android:scaleType="fitXY"/>


                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="?actionBarSize"
                    android:layout_gravity="bottom"
                    android:layout_margin="16dp"
                    android:background="@drawable/transprent_primary_rounded"
                    android:weightSum="4">


                    <LinearLayout
                        android:layout_width="wrap_content"
                        android:layout_height="match_parent"
                        android:orientation="vertical"
                        android:layout_weight="1"
                        android:gravity="center">

                        <com.cv.TextviewRegular
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/TextAppearance.AppCompat.Inverse"
                            android:text="32"/>

                        <com.cv.TextviewRegular
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/TextAppearance.AppCompat.Inverse"
                            android:text="Followers"/>
                    </LinearLayout>

                    <View
                        android:layout_width="1dp"
                        android:layout_height="30dp"
                        android:layout_gravity="center"
                        android:background="@color/white"/>

                    <LinearLayout
                        android:layout_width="wrap_content"
                        android:layout_height="match_parent"
                        android:orientation="vertical"
                        android:layout_weight="1"
                        android:gravity="center">

                        <com.cv.TextviewRegular
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/TextAppearance.AppCompat.Inverse"
                            android:text="50"/>

                        <com.cv.TextviewRegular
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/TextAppearance.AppCompat.Inverse"
                            android:text="Following"/>
                    </LinearLayout>

                    <View
                        android:layout_width="1dp"
                        android:layout_height="30dp"
                        android:layout_gravity="center"
                        android:background="@color/white"/>

                    <LinearLayout
                        android:layout_width="wrap_content"
                        android:layout_height="match_parent"
                        android:orientation="vertical"
                        android:layout_weight="1"
                        android:gravity="center">

                        <com.cv.TextviewRegular
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/TextAppearance.AppCompat.Inverse"
                            android:text="85"/>

                        <com.cv.TextviewRegular
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/TextAppearance.AppCompat.Inverse"
                            android:text="Post"/>
                    </LinearLayout>

                    <View
                        android:layout_width="1dp"
                        android:layout_height="30dp"
                        android:layout_gravity="center"
                        android:background="@color/white"/>

                    <LinearLayout
                        android:layout_width="wrap_content"
                        android:layout_height="match_parent"
                        android:orientation="vertical"
                        android:layout_weight="1"
                        android:gravity="center">

                        <com.cv.TextviewRegular
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/TextAppearance.AppCompat.Inverse"
                            android:text="02"/>

                        <com.cv.TextviewRegular
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/TextAppearance.AppCompat.Inverse"
                            android:text="My Service"/>
                    </LinearLayout>

                </LinearLayout>

            </FrameLayout>