显示隐藏的工具栏动画不流畅
Showing a hidden toolbar animation not smooth
在我最近的一个应用程序中，当用户在列表 (Recyclerview) 中滚动时，我实现了 hide/show 工具栏。我的应用程序有 3 个片段和一个视图寻呼机来呈现 them.The 工具栏在滚动时适当隐藏。但是，当我更改片段（在视图页面上调用 onPageChange 侦听器）时，我正在扩展工具栏。有时在展开时动画很流畅，但有时会有轻微的延迟。我不明白我做错了什么。
为了说明这一点，我录制了我的屏幕，请点击here观看视频。
这是我的 main_layout:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:fab="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.studentsins.lust.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/appBarLayouy"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="@style/AppTheme.PopupOverlay"
app:layout_scrollFlags="scroll|enterAlways" />
<android.support.design.widget.TabLayout
android:id="@+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="@dimen/tabsHeight"
style="@style/NavigationTab"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
<include layout="@layout/content_main"/>
<com.getbase.floatingactionbutton.FloatingActionsMenu
android:id="@+id/floatingActionMenu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
fab:fab_addButtonColorNormal="@color/blood_orange"
fab:fab_addButtonColorPressed="@color/dirtyWhite"
fab:fab_addButtonPlusIconColor="@color/dirtyWhite"
fab:fab_addButtonSize = "normal"
fab:fab_labelStyle="@style/menu_labels_style"
fab:fab_labelsPosition="left"
app:layout_anchor="@id/viewpager"
app:layout_anchorGravity="bottom|end">
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/createPlanBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/blood_orange"
fab:fab_title="Create a plan"
fab:fab_size="normal"
app:fab_icon="@drawable/ic_event_white_48dp"
fab:fab_colorPressed="@color/dirtyWhite"/>
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/changeStatusBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/blood_orange"
fab:fab_size="normal"
app:fab_icon="@drawable/ic_textsms_white_48dp"
fab:fab_title="Change status"
fab:fab_colorPressed="@color/dirtyWhite"/>
</com.getbase.floatingactionbutton.FloatingActionsMenu>
这是我的 feed_fragment:
public class FeedFragment extends Fragment {
public static final String ARG_PAGE = "ARG_PAGE";
private static final String TAG = FeedFragment.class.getSimpleName();
private int mPage;
private RecyclerView mRefreshLayout;
private Context mActivity;
public static FeedFragment newInstance(int page) {
Bundle args = new Bundle();
args.putInt(ARG_PAGE, page);
FeedFragment fragment = new FeedFragment();
fragment.setArguments(args);
return fragment;
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mPage = getArguments().getInt(ARG_PAGE);
mActivity = getActivity();
Log.d("MainActivity", "onCreate" + mPage);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_feed_layout,container,false);
mRefreshLayout = (RecyclerView) view.findViewById(R.id.feedCardViewList);
LinearLayoutManager linearLayoutManager = new LinearLayoutManager(mActivity);
linearLayoutManager.setOrientation(LinearLayoutManager.VERTICAL);
mRefreshLayout.setLayoutManager(linearLayoutManager);
mRefreshLayout.addOnScrollListener(new RecyclerView.OnScrollListener() {
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
if (dy >= 0) {
// Scrolling up.. hide the FAB
MainActivity.mFloatingActionsMenu.animate()
.setDuration(150)
.translationY(300);
} else {
// Scrolling down.. show the FAB
MainActivity.mFloatingActionsMenu.animate()
.setDuration(150)
.translationY(0);
}
Log.d(TAG,"DY value: "+dy);
}
});
ArrayList<String> users = new ArrayList<>();
users.add("Georgi Koemdzhiev");
users.add("Mariya Menova");
users.add("Simeon Simeonov");
users.add("Ivan Dqkov");
users.add("Dymityr Vasilev");
users.add("Petar Dimov");
users.add("Stoyan Stoyanov");
users.add("Alexander Lunar");
users.add("Awesome Jhon");
FeedCardAdapter adapter = new FeedCardAdapter(users,mActivity);
mRefreshLayout.setAdapter(adapter);
Log.d("MainActivity", "onCreateView" + mPage);
return view;
}
}
这是我的 MainActivity onCreate 方法：
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
sharedPreferences = PreferenceManager.getDefaultSharedPreferences(MainActivity.this);
editor = sharedPreferences.edit();
Boolean isUserLoggedIn = sharedPreferences.getBoolean(Constants.USER_IF_LOG_IN,false);
if(!isUserLoggedIn){
navigateToLogin();
}
// Get the ViewPager and set it's PagerAdapter so that it can display items
final ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
viewPager.setAdapter(new LustFragmentPagerAdapter(getSupportFragmentManager(), this));
// Give the TabLayout the ViewPager
final TabLayout tabLayout = (TabLayout) findViewById(R.id.sliding_tabs);
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
tabLayout.setupWithViewPager(viewPager);
mFloatingActionsMenu = (FloatingActionsMenu)findViewById(R.id.floatingActionMenu);
mChangeStatus = (FloatingActionButton)findViewById(R.id.changeStatusBtn);
mChangeStatus.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Log.d(TAG,"Change Status pressed! | " + viewPager.getCurrentItem());
mFloatingActionsMenu.collapse();
}
});
mCreatePlan = (FloatingActionButton)findViewById(R.id.createPlanBtn);
mCreatePlan.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Log.d(TAG,"Create plan pressed! | " + viewPager.getCurrentItem());
mFloatingActionsMenu.collapse();
}
});
viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
//Make sure that the fab is visible when scrolling the pages...
MainActivity.mFloatingActionsMenu.animate()
.setDuration(150)
.translationY(0);
//show the toolbar
expandToolbar();
}
@Override
public void onPageSelected(int position) {
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
这是我的 expandToolbar 方法代码：
public void expandToolbar(){
//setExpanded(boolean expanded, boolean animate)
AppBarLayout appBarLayout = (AppBarLayout)findViewById(R.id.appBarLayouy);
appBarLayout.setExpanded(true, true);
}
我可以建议你另一种方法吗？只是 Show/Hide 使用设置可见性从 GONE 到 VISIBLE 或从可见到消失的顶部栏取决于 show/hide 需要。并将 android:animateLayoutChanges="true" 添加到顶部栏的父级。
我找到了导致工具栏展开动画延迟的原因。问题是监听器中的 onPageChanged 方法被调用了很多次，因此下面的代码被调用了很多次：
onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
//Make sure that the fab is visible when scrolling the pages...
MainActivity.mFloatingActionsMenu.animate()
.setDuration(150)
.translationY(0);
//show the toolbar
expandToolbar();
所以我认为这导致系统在处理这么多 calls/animations.
时不时会有些困难。
我为解决这个问题所做的只是将我的代码从 onScrolled 移动到 "onPageScrollStateChanged" 方法（每次 viewpager 滑动 left/right 调用一次）。
请将android.support.design.widget.AppBarLayout改为其他ViewGroup
它可以解决您的问题。
加油！
在我最近的一个应用程序中，当用户在列表 (Recyclerview) 中滚动时，我实现了 hide/show 工具栏。我的应用程序有 3 个片段和一个视图寻呼机来呈现 them.The 工具栏在滚动时适当隐藏。但是，当我更改片段（在视图页面上调用 onPageChange 侦听器）时，我正在扩展工具栏。有时在展开时动画很流畅，但有时会有轻微的延迟。我不明白我做错了什么。 为了说明这一点，我录制了我的屏幕，请点击here观看视频。
这是我的 main_layout:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:fab="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.studentsins.lust.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/appBarLayouy"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="@style/AppTheme.PopupOverlay"
app:layout_scrollFlags="scroll|enterAlways" />
<android.support.design.widget.TabLayout
android:id="@+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="@dimen/tabsHeight"
style="@style/NavigationTab"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
<include layout="@layout/content_main"/>
<com.getbase.floatingactionbutton.FloatingActionsMenu
android:id="@+id/floatingActionMenu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
fab:fab_addButtonColorNormal="@color/blood_orange"
fab:fab_addButtonColorPressed="@color/dirtyWhite"
fab:fab_addButtonPlusIconColor="@color/dirtyWhite"
fab:fab_addButtonSize = "normal"
fab:fab_labelStyle="@style/menu_labels_style"
fab:fab_labelsPosition="left"
app:layout_anchor="@id/viewpager"
app:layout_anchorGravity="bottom|end">
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/createPlanBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/blood_orange"
fab:fab_title="Create a plan"
fab:fab_size="normal"
app:fab_icon="@drawable/ic_event_white_48dp"
fab:fab_colorPressed="@color/dirtyWhite"/>
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/changeStatusBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/blood_orange"
fab:fab_size="normal"
app:fab_icon="@drawable/ic_textsms_white_48dp"
fab:fab_title="Change status"
fab:fab_colorPressed="@color/dirtyWhite"/>
</com.getbase.floatingactionbutton.FloatingActionsMenu>
这是我的 feed_fragment:
public class FeedFragment extends Fragment {
public static final String ARG_PAGE = "ARG_PAGE";
private static final String TAG = FeedFragment.class.getSimpleName();
private int mPage;
private RecyclerView mRefreshLayout;
private Context mActivity;
public static FeedFragment newInstance(int page) {
Bundle args = new Bundle();
args.putInt(ARG_PAGE, page);
FeedFragment fragment = new FeedFragment();
fragment.setArguments(args);
return fragment;
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mPage = getArguments().getInt(ARG_PAGE);
mActivity = getActivity();
Log.d("MainActivity", "onCreate" + mPage);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_feed_layout,container,false);
mRefreshLayout = (RecyclerView) view.findViewById(R.id.feedCardViewList);
LinearLayoutManager linearLayoutManager = new LinearLayoutManager(mActivity);
linearLayoutManager.setOrientation(LinearLayoutManager.VERTICAL);
mRefreshLayout.setLayoutManager(linearLayoutManager);
mRefreshLayout.addOnScrollListener(new RecyclerView.OnScrollListener() {
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
if (dy >= 0) {
// Scrolling up.. hide the FAB
MainActivity.mFloatingActionsMenu.animate()
.setDuration(150)
.translationY(300);
} else {
// Scrolling down.. show the FAB
MainActivity.mFloatingActionsMenu.animate()
.setDuration(150)
.translationY(0);
}
Log.d(TAG,"DY value: "+dy);
}
});
ArrayList<String> users = new ArrayList<>();
users.add("Georgi Koemdzhiev");
users.add("Mariya Menova");
users.add("Simeon Simeonov");
users.add("Ivan Dqkov");
users.add("Dymityr Vasilev");
users.add("Petar Dimov");
users.add("Stoyan Stoyanov");
users.add("Alexander Lunar");
users.add("Awesome Jhon");
FeedCardAdapter adapter = new FeedCardAdapter(users,mActivity);
mRefreshLayout.setAdapter(adapter);
Log.d("MainActivity", "onCreateView" + mPage);
return view;
}
}
这是我的 MainActivity onCreate 方法：
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
sharedPreferences = PreferenceManager.getDefaultSharedPreferences(MainActivity.this);
editor = sharedPreferences.edit();
Boolean isUserLoggedIn = sharedPreferences.getBoolean(Constants.USER_IF_LOG_IN,false);
if(!isUserLoggedIn){
navigateToLogin();
}
// Get the ViewPager and set it's PagerAdapter so that it can display items
final ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
viewPager.setAdapter(new LustFragmentPagerAdapter(getSupportFragmentManager(), this));
// Give the TabLayout the ViewPager
final TabLayout tabLayout = (TabLayout) findViewById(R.id.sliding_tabs);
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
tabLayout.setupWithViewPager(viewPager);
mFloatingActionsMenu = (FloatingActionsMenu)findViewById(R.id.floatingActionMenu);
mChangeStatus = (FloatingActionButton)findViewById(R.id.changeStatusBtn);
mChangeStatus.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Log.d(TAG,"Change Status pressed! | " + viewPager.getCurrentItem());
mFloatingActionsMenu.collapse();
}
});
mCreatePlan = (FloatingActionButton)findViewById(R.id.createPlanBtn);
mCreatePlan.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Log.d(TAG,"Create plan pressed! | " + viewPager.getCurrentItem());
mFloatingActionsMenu.collapse();
}
});
viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
//Make sure that the fab is visible when scrolling the pages...
MainActivity.mFloatingActionsMenu.animate()
.setDuration(150)
.translationY(0);
//show the toolbar
expandToolbar();
}
@Override
public void onPageSelected(int position) {
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
这是我的 expandToolbar 方法代码：
public void expandToolbar(){
//setExpanded(boolean expanded, boolean animate)
AppBarLayout appBarLayout = (AppBarLayout)findViewById(R.id.appBarLayouy);
appBarLayout.setExpanded(true, true);
}
我可以建议你另一种方法吗？只是 Show/Hide 使用设置可见性从 GONE 到 VISIBLE 或从可见到消失的顶部栏取决于 show/hide 需要。并将 android:animateLayoutChanges="true" 添加到顶部栏的父级。
我找到了导致工具栏展开动画延迟的原因。问题是监听器中的 onPageChanged 方法被调用了很多次，因此下面的代码被调用了很多次：
onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
//Make sure that the fab is visible when scrolling the pages...
MainActivity.mFloatingActionsMenu.animate()
.setDuration(150)
.translationY(0);
//show the toolbar
expandToolbar();
所以我认为这导致系统在处理这么多 calls/animations.
时不时会有些困难。我为解决这个问题所做的只是将我的代码从 onScrolled 移动到 "onPageScrollStateChanged" 方法（每次 viewpager 滑动 left/right 调用一次）。
请将android.support.design.widget.AppBarLayout改为其他ViewGroup 它可以解决您的问题。 加油！