Android 中的视差 Scrolling/Collapsable 工具栏
Parallax Scrolling/Collapsable Toolbar in Android
所以这里有一些来自 Material 设计的 udacity 项目的代码。它应该显示一个折叠工具栏,将带有文本的照片转换为简单文本。大胆的视频让我相信代码有效,但是当我将应用程序下载到我的 phone 时,工具栏没有折叠(OS 是 android 6.0.1,v23)。有什么我可以更改以确保工具栏折叠的吗?
代码
xml
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="192dp"
android:background="?colorPrimary">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:collapsedTitleTextAppearance="@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse"
app:expandedTitleTextAppearance="@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse"
app:expandedTitleMarginStart="72dp"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_collapseMode="parallax"
android:scaleType="centerCrop"
android:src="@drawable/eclairs" />
<android.support.v7.widget.Toolbar
android:id="@+id/app_bar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:navigationIcon="@drawable/arrow_left"
app:contentInsetStart="72dp"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<ScrollView
android:layout_width="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
android:layout_height="wrap_content">
<TextView
android:layout_marginTop="16dp"
android:textAppearance="@style/Base.TextAppearance.AppCompat.Body1"
android:text="@string/cupcake_ipsum"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp" />
</ScrollView>
JAVA
package com.example.android.dynamicsurfacesdemo;
import android.app.Activity;
import android.os.Bundle;
import android.support.design.widget.CollapsingToolbarLayout;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
((CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar_layout)).setTitle("Eclairs");
}
}
我假设您布局的父级是 CoordinatorLayout。
要使 CoordiantorLayout 正常工作,请使用 NestedScrollView 而不是简单的 ScrollView。
所以这里有一些来自 Material 设计的 udacity 项目的代码。它应该显示一个折叠工具栏,将带有文本的照片转换为简单文本。大胆的视频让我相信代码有效,但是当我将应用程序下载到我的 phone 时,工具栏没有折叠(OS 是 android 6.0.1,v23)。有什么我可以更改以确保工具栏折叠的吗?
代码
xml
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="192dp"
android:background="?colorPrimary">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:collapsedTitleTextAppearance="@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse"
app:expandedTitleTextAppearance="@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse"
app:expandedTitleMarginStart="72dp"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_collapseMode="parallax"
android:scaleType="centerCrop"
android:src="@drawable/eclairs" />
<android.support.v7.widget.Toolbar
android:id="@+id/app_bar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:navigationIcon="@drawable/arrow_left"
app:contentInsetStart="72dp"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<ScrollView
android:layout_width="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
android:layout_height="wrap_content">
<TextView
android:layout_marginTop="16dp"
android:textAppearance="@style/Base.TextAppearance.AppCompat.Body1"
android:text="@string/cupcake_ipsum"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp" />
</ScrollView>
JAVA
package com.example.android.dynamicsurfacesdemo;
import android.app.Activity;
import android.os.Bundle;
import android.support.design.widget.CollapsingToolbarLayout;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
((CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar_layout)).setTitle("Eclairs");
}
}
我假设您布局的父级是 CoordinatorLayout。
要使 CoordiantorLayout 正常工作,请使用 NestedScrollView 而不是简单的 ScrollView。