【问题标题】:Add an icon image beside the title on the collapsing layout在折叠布局的标题旁边添加图标图像
【发布时间】:2018-04-03 18:13:10
【问题描述】:

我想将图像添加到折叠布局中。我可以添加文字(标题),但如何添加图片?

【问题讨论】:

    标签: android android-support-library


    【解决方案1】:

    请看以下代码:

    <android.support.design.widget.CoordinatorLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/user_profile_coordinatorlayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true">
    
    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="500dp"
        android:fitsSystemWindows="true"
        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="?attr/colorPrimary"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:layout_scrollFlags="scroll">
    
            <ImageView
                android:id="@+id/picture"
                android:layout_width="match_parent"
                android:layout_height="500dp"
                android:adjustViewBounds="true"
                android:scaleType="centerCrop"
                android:src="@drawable/cover_image_placeholder"
                app:layout_collapseMode="parallax" />
    
            <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" />
        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>
    
    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="true"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
    
            <!-- Some views -->
    
        </LinearLayout>
    </android.support.v4.widget.NestedScrollView>
    </android.support.design.widget.CoordinatorLayout>
    

    并参考承载图片的sn-p,只需将图片设置到此imageview即可获得所需的结果:

    <ImageView
         android:id="@+id/picture"
         android:layout_width="match_parent"
         android:layout_height="500dp"
         android:adjustViewBounds="true"
         android:scaleType="centerCrop"
         android:src="@drawable/my_image"
         app:layout_collapseMode="parallax" />
    

    显然,您可以自定义图片展开时的高度,在我的示例中为 500dp,并且还可以进行裁剪。 app:layout_collapseMode="parallax" 定义工具栏在滚动时的行为方式。

    试试吧,干杯!

    【讨论】:

    • 我不想要背景图片...我想要折叠布局中标题旁边的图片
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-01-07
    • 2012-05-20
    • 2015-09-23
    • 1970-01-01
    • 2011-11-23
    • 2021-02-05
    • 1970-01-01
    相关资源
    最近更新 更多