使用粘性标签和视图寻呼机的布局

时间:2016-04-06 13:18:28

标签: android

我想创建一个像这样的布局。其中有关于布局标题的更多信息(即图像,标题,少数文本视图,按钮)。标题布局下方有一个标签和一个包含每个标签数据的视图寻呼机。 当我向上滚动时,标签需要粘在顶部。 请帮帮我。非常感谢高级。

enter image description here

我尝试了下面的代码,但是当标题布局内容太大而所有内容都不可见而且标签低于屏幕尺寸并且向上滚动时不再出现时,我遇到了问题。

<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:fitsSystemWindows="true">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        android:fitsSystemWindows="true"
        app:contentScrim="?attr/colorPrimary"
        app:collapsedTitleTextAppearance="@style/ActionBar.TitleText">

        <ScrollView
            android:layout_width="match_parent"
            android:fillViewport="true"
            app:layout_collapseMode="parallax"
            android:layout_height="wrap_content"
            android:id="@+id/scrollView">
            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/scrollable_view">
                <RelativeLayout
                    android:id="@+id/carouselLayout"
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/group_profile_image_height">
                    <android.support.v4.view.ViewPager
                        android:id="@+id/backdrop"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content" />
                    <View
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:background="@drawable/album_view_background"/>
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="@dimen/profile_image_margin"
                        android:layout_marginStart="@dimen/profile_image_margin"
                        android:textSize="@dimen/comment_post_button_size"
                        android:textColor="@color/white"
                        android:layout_marginBottom="@dimen/profile_image_margin"
                        android:shadowColor="@color/text_shadow"
                        android:shadowDx="1"
                        android:shadowDy="1"
                        android:shadowRadius="2"
                        android:id="@+id/content_title"
                        android:layout_alignParentBottom="true"/>
                    <ImageView
                        android:id="@+id/left_arrow"
                        android:visibility="invisible"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_centerInParent="true"
                        android:tint="@color/white"
                        android:contentDescription="@string/descr_image"
                        android:layout_centerVertical="true"
                        android:layout_alignParentStart="true"
                        android:layout_alignParentLeft="true"
                        android:padding="@dimen/left_right_arrow_margin"
                        android:paddingStart="@dimen/left_right_arrow_margin"
                        android:paddingEnd="@dimen/left_right_arrow_margin"
                        android:src="@drawable/ic_chevron_left"/>
                    <ImageView
                        android:id="@+id/right_arrow"
                        android:visibility="invisible"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_centerInParent="true"
                        android:contentDescription="@string/descr_image"
                        android:tint="@color/white"
                        android:layout_alignParentRight="true"
                        android:layout_alignParentEnd="true"
                        android:layout_centerVertical="true"
                        android:padding="@dimen/left_right_arrow_margin"
                        android:paddingStart="@dimen/left_right_arrow_margin"
                        android:paddingEnd="@dimen/left_right_arrow_margin"
                        android:src="@drawable/ic_chevron_right"/>
                    <TextView
                        android:id="@+id/image_count"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:textColor="@color/white"
                        android:layout_below="@+id/right_arrow"
                        android:layout_alignParentRight="true"
                        android:layout_alignParentEnd="true"
                        android:layout_centerVertical="true"
                        android:paddingRight="@dimen/left_right_arrow_margin"
                        android:paddingLeft="@dimen/left_right_arrow_margin"
                        android:paddingStart="@dimen/left_right_arrow_margin"
                        android:paddingEnd="@dimen/left_right_arrow_margin" />
                </RelativeLayout>
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@color/white"
                    android:layout_below="@+id/carouselLayout"
                    android:orientation="vertical">
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:id="@+id/owner_detail_layout"
                        android:layout_gravity="center"
                        android:layout_marginBottom="@dimen/profile_page_left_right_margin"
                        android:paddingBottom="@dimen/view_default_padding"
                        android:paddingTop="@dimen/view_default_padding"
                        android:background="@color/grey_light"
                        android:orientation="horizontal">
                        <classes.common.ui.BezelImageView
                            android:id="@+id/owner_image"
                            android:scaleType="centerCrop"
                            android:layout_width="@dimen/profile_image_height"
                            android:layout_height="@dimen/profile_image_width"
                            android:layout_gravity="center_vertical"
                            android:layout_marginStart="@dimen/profile_image_margin"
                            android:layout_marginLeft="@dimen/profile_image_margin"
                            android:foregroundGravity="right"
                            app:maskDrawable="@drawable/circle_mask"
                            app:borderDrawable="@drawable/circle_border" />
                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginStart="@dimen/profile_image_margin"
                            android:layout_marginLeft="@dimen/profile_image_margin"
                            android:textSize="@dimen/text_size_medium_plus"
                            android:textColor="@color/grey_dark"
                            android:layout_gravity="center_vertical"
                            android:gravity="center_vertical"
                            android:id="@+id/owner_name"/>
                    </LinearLayout>
                    <classes.common.ui.SelectableTextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:maxLines="3"
                        android:ellipsize="end"
                        android:layout_marginRight="@dimen/profile_image_margin"
                        android:layout_marginEnd="@dimen/profile_image_margin"
                        android:layout_marginLeft="@dimen/profile_image_margin"
                        android:layout_marginStart="@dimen/profile_image_margin"
                        android:layout_marginBottom="@dimen/profile_page_left_right_margin"
                        android:textSize="@dimen/text_size_medium_plus"
                        android:textColor="@color/body_text_1"
                        android:id="@+id/listing_description"/>
                    <LinearLayout
                        android:orientation="horizontal"
                        android:weightSum="1"
                        android:id="@+id/likeCommentContent"
                        android:layout_marginBottom="@dimen/profile_page_left_right_margin"
                        android:visibility="visible"
                        android:background="@color/grey_light"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content">
                        <LinearLayout
                            android:layout_width="0dp"
                            android:layout_weight=".5"
                            android:id="@+id/likeBlock"
                            android:layout_gravity="center"
                            android:gravity="center"
                            android:layout_height="wrap_content">
                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:textSize="@dimen/text_size_medium_plus"
                                android:textColor="@color/grey_dark"
                                android:layout_marginTop="@dimen/margin_short"
                                android:layout_marginBottom="@dimen/margin_short"
                                android:id="@+id/likeIcon" />
                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:textSize="@dimen/text_size_medium_plus"
                                android:textColor="@color/grey_dark"
                                android:layout_marginTop="@dimen/margin_short"
                                android:layout_marginBottom="@dimen/margin_short"
                                android:layout_marginLeft="@dimen/profile_page_left_right_margin"
                                android:layout_marginStart="@dimen/profile_page_left_right_margin"
                                android:id="@+id/likeCountView" />
                        </LinearLayout>
                        <View android:layout_height="match_parent"
                            android:layout_width="1dp"
                            android:background="@color/light_gray" />
                        <LinearLayout
                            android:layout_width="0dp"
                            android:layout_weight=".5"
                            android:id="@+id/commentBlock"
                            android:layout_gravity="center"
                            android:gravity="center"
                            android:layout_height="wrap_content">
                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:textSize="@dimen/text_size_medium_plus"
                                android:textColor="@color/grey_dark"
                                android:layout_marginTop="@dimen/margin_short"
                                android:layout_marginBottom="@dimen/margin_short"
                                android:id="@+id/commentIcon" />
                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:id="@+id/commentCountView"
                                android:textSize="@dimen/text_size_medium_plus"
                                android:layout_marginLeft="@dimen/profile_page_left_right_margin"
                                android:layout_marginStart="@dimen/profile_page_left_right_margin"
                                android:layout_marginTop="@dimen/margin_short"
                                android:layout_marginBottom="@dimen/margin_short"
                                android:textColor="@color/grey_dark"/>
                        </LinearLayout>
                    </LinearLayout>
                    <LinearLayout
                        android:orientation="horizontal"
                        android:weightSum="1"
                        android:layout_marginBottom="@dimen/margin_short"
                        android:id="@+id/review_wishlist_layout"
                        android:visibility="visible"
                        android:layout_gravity="center"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content">
                        <LinearLayout
                            android:layout_width="0dp"
                            android:layout_weight=".5"
                            android:id="@+id/review_block"
                            android:background="@color/grey_light"
                            android:layout_marginRight="@dimen/profile_image_margin"
                            android:layout_marginEnd="@dimen/profile_image_margin"
                            android:layout_marginStart="@dimen/profile_image_margin"
                            android:layout_marginLeft="@dimen/profile_image_margin"
                            android:layout_gravity="center"
                            android:gravity="center"
                            android:layout_height="wrap_content">
                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:textSize="@dimen/text_size_medium_plus"
                                android:textColor="@color/grey_dark"
                                android:layout_marginTop="@dimen/margin_short"
                                android:layout_marginBottom="@dimen/margin_short"
                                android:id="@+id/review_icon" />
                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:textSize="@dimen/text_size_medium_plus"
                                android:textColor="@color/grey_dark"
                                android:text="@string/write_review_text"
                                android:layout_marginTop="@dimen/margin_short"
                                android:layout_marginBottom="@dimen/margin_short"
                                android:layout_marginLeft="@dimen/profile_page_left_right_margin"
                                android:layout_marginStart="@dimen/profile_page_left_right_margin"
                                android:id="@+id/review_text" />
                        </LinearLayout>
                        <LinearLayout
                            android:layout_width="0dp"
                            android:layout_weight=".5"
                            android:id="@+id/wishlist_block"
                            android:background="@color/grey_light"
                            android:layout_marginRight="@dimen/profile_image_margin"
                            android:layout_marginEnd="@dimen/profile_image_margin"
                            android:layout_marginStart="@dimen/profile_image_margin"
                            android:layout_marginLeft="@dimen/profile_image_margin"
                            android:layout_gravity="center"
                            android:gravity="center"
                            android:layout_height="wrap_content">
                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:textSize="@dimen/text_size_medium_plus"
                                android:textColor="@color/grey_dark"
                                android:layout_marginTop="@dimen/margin_short"
                                android:layout_marginBottom="@dimen/margin_short"
                                android:id="@+id/wishlist_icon" />
                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:id="@+id/wishlist_text"
                                android:text="@string/add_wishlist_text"
                                android:textSize="@dimen/text_size_medium_plus"
                                android:layout_marginLeft="@dimen/profile_page_left_right_margin"
                                android:layout_marginStart="@dimen/profile_page_left_right_margin"
                                android:layout_marginTop="@dimen/margin_short"
                                android:layout_marginBottom="@dimen/margin_short"
                                android:textColor="@color/grey_dark"/>
                        </LinearLayout>
                    </LinearLayout>
                </LinearLayout>
            </RelativeLayout>
        </ScrollView>

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:theme="@style/ActionBarThemeOverlay"
            app:popupTheme="@style/ActionBarPopupThemeOverlay"
            app:layout_collapseMode="pin"
            android:background="@drawable/gradient_bg" />

    </android.support.design.widget.CollapsingToolbarLayout>

</android.support.design.widget.AppBarLayout>

<ProgressBar
    style="?android:attr/progressBarStyle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:id="@+id/progressBar"
    android:layout_gravity="center"/>

<android.support.v4.widget.NestedScrollView
    android:id="@+id/nestedScrollView"
    android:fillViewport="true"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:visibility="visible"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <android.support.design.widget.AppBarLayout
            android:id="@+id/appbar2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            android:fitsSystemWindows="true">
            <android.support.design.widget.CollapsingToolbarLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:fillViewport="true"
                android:id="@+id/bottomView"
                android:layout_below="@id/collapsing_toolbar"
                app:layout_scrollFlags="scroll|enterAlways">
                <android.support.design.widget.TabLayout
                    android:id="@+id/slidingTabs"
                    android:fitsSystemWindows="true"
                    android:layout_width="match_parent"
                    app:tabTextAppearance="@style/TabTitleTextAppearance"
                    app:tabMode="scrollable"
                    app:tabGravity="fill"
                    android:background="@color/transparent"
                    android:layout_height="wrap_content"/>
            </android.support.design.widget.CollapsingToolbarLayout>
        </android.support.design.widget.AppBarLayout>
        <android.support.v4.view.ViewPager
            android:id="@+id/pager"
            android:layout_below="@+id/appbar2"
            android:layout_width="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            android:layout_height="wrap_content">
        </android.support.v4.view.ViewPager>
    </RelativeLayout>
</android.support.v4.widget.NestedScrollView>

0 个答案:

没有答案