我需要做什么才能在滚动时隐藏工具栏?
What do I need to do to make my toolbar hide when I scroll?
我正在努力做到这一点,以便当我滚动包含回收站视图的片段时,我的工具栏会自行隐藏,在框架布局中膨胀。
我已经尝试更改最外面的 relativelayout 和 coordinatorlayout 并移动一些东西,以及添加滚动标签,其中 none 似乎有效(我可能做错了)。
这是有问题的 activity 的布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/mainLayout"
android:background="@color/colorMain"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".MainActivity">
<FrameLayout
android:id="@+id/frag_container"
android:clipToPadding="true"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_below="@id/toolbar_top"
android:layout_above="@id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_above="@id/bottom_navigation"
app:rippleColor="@color/colorPrimary"
android:clickable="true"
android:layout_margin="18dp"
android:tint="@color/colorMain"
app:srcCompat="@drawable/ic_plus" />
<androidx.appcompat.widget.Toolbar
app:layout_constraintTop_toTopOf="parent"
android:id="@+id/toolbar_top"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:elevation="1dp"
android:background="@color/colorMain">
<ImageButton
android:id="@+id/accountButton"
android:layout_gravity="start"
android:tint="@color/colorSecondary"
android:background="?attr/selectableItemBackgroundBorderless"
app:srcCompat="@drawable/ic_account"
android:layout_width="36dp"
android:layout_height="36dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:contentDescription="@string/account" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/app_title"
android:textColor="@color/colorSecondary"
android:fontFamily="@font/productsansmedium"
android:textSize="20sp"
android:layout_gravity="center"
android:id="@+id/toolbar_title" />
</androidx.appcompat.widget.Toolbar>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:theme="@style/Widget.BottomNavigationView"
android:background="@color/bottomNavColor"
app:itemIconTint="@drawable/navbar_color_selector"
app:itemTextColor="@drawable/navbar_color_selector"
app:elevation="20dp"
android:id="@+id/bottom_navigation"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:menu="@menu/bottom_nav_items" />
</RelativeLayout>
在此先感谢您的帮助!
可以使用折叠工具栏看到了吗? https://www.journaldev.com/13927/android-collapsingtoolbarlayout-example?
集成 collapsingtoolbarlayout 后,您可以在运行时以编程方式使用 appbarlayout,以便在您像这样滚动时隐藏工具栏
AppBarLayout appBarLayout;
appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
if (Math.abs(verticalOffset) == appBarLayout.getTotalScrollRange()) {
//at toolbar position
} else if (verticalOffset == 0) {
//totally expanded
} else {
//somewhere in between
}
}
});
对于科特林
appBarLayout.addOnOffsetChangedListener(AppBarLayout.OnOffsetChangedListener { appBarLayout, verticalOffset ->
if (Math.abs(verticalOffset) == appBarLayout.totalScrollRange) {
//at toolbar position
} else if (verticalOffset == 0) {
//totally expanded
} else {
//somewhere in between
}
})
您请求的功能叫做 Collapsingtoolbarlayout 可以参考这个
android:layout_height="200dp"
android:scaleType="centerCrop"
android:src="@drawable/photo"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.7" />
<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/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="@layout/content_scrolling" />
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/fab_margin"
app:layout_anchor="@id/app_bar"
app:layout_anchorGravity="bottom|end"
app:srcCompat="@android:drawable/ic_dialog_info" />
之后你必须设置菜单项
<menu 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"
tools:context="com.journaldev.collapsingtoolbarlayout.ScrollingActivity">
<item
android:id="@+id/action_settings"
android:orderInCategory="100"
android:title="@string/action_settings"
app:showAsAction="never" />
<item
android:id="@+id/action_info"
android:orderInCategory="200"
android:title="info"
app:showAsAction="ifRoom"
android:icon="@android:drawable/ic_dialog_info"/>
并在 java 代码中执行此操作
public class ScrollingActivity 扩展 AppCompatActivity {
private Menu menu;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_scrolling);
final Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
.setAction("Action", null).show();
}
});
AppBarLayout mAppBarLayout = (AppBarLayout) findViewById(R.id.app_bar);
mAppBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
boolean isShow = false;
int scrollRange = -1;
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
if (scrollRange == -1) {
scrollRange = appBarLayout.getTotalScrollRange();
}
if (scrollRange + verticalOffset == 0) {
isShow = true;
showOption(R.id.action_info);
} else if (isShow) {
isShow = false;
hideOption(R.id.action_info);
}
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
this.menu = menu;
getMenuInflater().inflate(R.menu.menu_scrolling, menu);
hideOption(R.id.action_info);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
} else if (id == R.id.action_info) {
return true;
}
return super.onOptionsItemSelected(item);
}
private void hideOption(int id) {
MenuItem item = menu.findItem(id);
item.setVisible(false);
}
private void showOption(int id) {
MenuItem item = menu.findItem(id);
item.setVisible(true);
}
}
我正在努力做到这一点,以便当我滚动包含回收站视图的片段时,我的工具栏会自行隐藏,在框架布局中膨胀。
我已经尝试更改最外面的 relativelayout 和 coordinatorlayout 并移动一些东西,以及添加滚动标签,其中 none 似乎有效(我可能做错了)。
这是有问题的 activity 的布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/mainLayout"
android:background="@color/colorMain"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".MainActivity">
<FrameLayout
android:id="@+id/frag_container"
android:clipToPadding="true"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_below="@id/toolbar_top"
android:layout_above="@id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_above="@id/bottom_navigation"
app:rippleColor="@color/colorPrimary"
android:clickable="true"
android:layout_margin="18dp"
android:tint="@color/colorMain"
app:srcCompat="@drawable/ic_plus" />
<androidx.appcompat.widget.Toolbar
app:layout_constraintTop_toTopOf="parent"
android:id="@+id/toolbar_top"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:elevation="1dp"
android:background="@color/colorMain">
<ImageButton
android:id="@+id/accountButton"
android:layout_gravity="start"
android:tint="@color/colorSecondary"
android:background="?attr/selectableItemBackgroundBorderless"
app:srcCompat="@drawable/ic_account"
android:layout_width="36dp"
android:layout_height="36dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:contentDescription="@string/account" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/app_title"
android:textColor="@color/colorSecondary"
android:fontFamily="@font/productsansmedium"
android:textSize="20sp"
android:layout_gravity="center"
android:id="@+id/toolbar_title" />
</androidx.appcompat.widget.Toolbar>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:theme="@style/Widget.BottomNavigationView"
android:background="@color/bottomNavColor"
app:itemIconTint="@drawable/navbar_color_selector"
app:itemTextColor="@drawable/navbar_color_selector"
app:elevation="20dp"
android:id="@+id/bottom_navigation"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:menu="@menu/bottom_nav_items" />
</RelativeLayout>
在此先感谢您的帮助!
可以使用折叠工具栏看到了吗? https://www.journaldev.com/13927/android-collapsingtoolbarlayout-example?
集成 collapsingtoolbarlayout 后,您可以在运行时以编程方式使用 appbarlayout,以便在您像这样滚动时隐藏工具栏
AppBarLayout appBarLayout;
appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
if (Math.abs(verticalOffset) == appBarLayout.getTotalScrollRange()) {
//at toolbar position
} else if (verticalOffset == 0) {
//totally expanded
} else {
//somewhere in between
}
}
});
对于科特林
appBarLayout.addOnOffsetChangedListener(AppBarLayout.OnOffsetChangedListener { appBarLayout, verticalOffset ->
if (Math.abs(verticalOffset) == appBarLayout.totalScrollRange) {
//at toolbar position
} else if (verticalOffset == 0) {
//totally expanded
} else {
//somewhere in between
}
})
您请求的功能叫做 Collapsingtoolbarlayout 可以参考这个
android:layout_height="200dp"
android:scaleType="centerCrop"
android:src="@drawable/photo"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.7" />
<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/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="@layout/content_scrolling" />
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/fab_margin"
app:layout_anchor="@id/app_bar"
app:layout_anchorGravity="bottom|end"
app:srcCompat="@android:drawable/ic_dialog_info" />
之后你必须设置菜单项
<menu 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"
tools:context="com.journaldev.collapsingtoolbarlayout.ScrollingActivity">
<item
android:id="@+id/action_settings"
android:orderInCategory="100"
android:title="@string/action_settings"
app:showAsAction="never" />
<item
android:id="@+id/action_info"
android:orderInCategory="200"
android:title="info"
app:showAsAction="ifRoom"
android:icon="@android:drawable/ic_dialog_info"/>
并在 java 代码中执行此操作
public class ScrollingActivity 扩展 AppCompatActivity {
private Menu menu;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_scrolling);
final Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
.setAction("Action", null).show();
}
});
AppBarLayout mAppBarLayout = (AppBarLayout) findViewById(R.id.app_bar);
mAppBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
boolean isShow = false;
int scrollRange = -1;
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
if (scrollRange == -1) {
scrollRange = appBarLayout.getTotalScrollRange();
}
if (scrollRange + verticalOffset == 0) {
isShow = true;
showOption(R.id.action_info);
} else if (isShow) {
isShow = false;
hideOption(R.id.action_info);
}
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
this.menu = menu;
getMenuInflater().inflate(R.menu.menu_scrolling, menu);
hideOption(R.id.action_info);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
} else if (id == R.id.action_info) {
return true;
}
return super.onOptionsItemSelected(item);
}
private void hideOption(int id) {
MenuItem item = menu.findItem(id);
item.setVisible(false);
}
private void showOption(int id) {
MenuItem item = menu.findItem(id);
item.setVisible(true);
}
}