Android SupportActionBar不显示/隐藏动画

时间:2015-11-12 08:53:43

标签: android animation android-actionbar

我发现很多关于如何禁用Android ActionBar动画的问题。我有完全相反的问题。我确实想要动画,但它应该开箱即用吗?

我认为问题在于我的自定义工具栏:

<android.support.design.widget.AppBarLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar_parent"
    android:layout_width="match_parent"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar android:id="@+id/toolbar"
        android:layout_width="match_parent" android:layout_height="@dimen/menu_height"
        android:minHeight="@dimen/menu_height"
        android:background="@color/backgroundColor" app:popupTheme="@style/AppTheme.PopupOverlay"
        android:theme="@style/ToolbarColoredBackArrow"/>

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

我在mij活动中设置如下:

 Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
 setSupportActionBar(toolbar);

工具栏工作正常,但当我调用这些方法之一时没有动画:

protected void hideActionBar(){
    ActionBar ab = getSupportActionBar();
    if (ab.isShowing()) {
        ab.hide();
    }

}

protected void showActionBar(){
    ActionBar ab = getSupportActionBar();
    if (!ab.isShowing()) {
        ab.show();
    }
}

这是什么原因?

5 个答案:

答案 0 :(得分:14)

请放弃我上面的评论。我对此做了一些研究,上面的建议并不重要。

当您致电setSupportActionBar(Toolbar)时,会发生以下情况:

public void setSupportActionBar(Toolbar toolbar) {
    ....
    ToolbarActionBar tbab = new ToolbarActionBar(toolbar, ((Activity) mContext).getTitle(),
            mAppCompatWindowCallback);
    mActionBar = tbab;
    ....
}

因此,后续调用getSupportActionBar()会返回ToolbarActionBar的实例。看看这个类如何实现我们感兴趣的功能:

setShowHideAnimationEnabled(boolean):正如您所说,此方法没有区别。

@Override
public void setShowHideAnimationEnabled(boolean enabled) {
    // This space for rent; no-op.
}

show():仅使操作栏可见 - 没有动画支持。

@Override
public void show() {
    // TODO: Consider a better transition for this.
    // Right now use no automatic transition so that the app can supply one if desired.
    mDecorToolbar.setVisibility(View.VISIBLE);
}

hide():只会使操作栏可见 - 再次,没有动画支持。

@Override
public void hide() {
    // TODO: Consider a better transition for this.
    // Right now use no automatic transition so that the app can supply one if desired.
    mDecorToolbar.setVisibility(View.GONE);
}

show()hide()中的评论暗示开发人员应提供动画过渡。也许,这样的事情:

protected void hideActionBar(){
    final ActionBar ab = getSupportActionBar();
    if (ab != null && ab.isShowing()) {
        if(mToolbar != null) {
            mToolbar.animate().translationY(-112).setDuration(600L)
                    .withEndAction(new Runnable() {
                        @Override
                        public void run() {
                            ab.hide();
                        }
                    }).start();
        } else {
            ab.hide();
        }
    }
}

protected void showActionBar(){
    ActionBar ab = getSupportActionBar();
    if (ab != null && !ab.isShowing()) {
        ab.show();
        if(mToolbar != null) {
            mToolbar.animate().translationY(0).setDuration(600L).start();
        }
    }
}

mToolbar.animate().....部分是从内存中编写的 - 语法可能不正确:(。您还可以添加.alpha(0(during hide) or 1(during show))以使转换看起来更好。

<强>实施

现在应该清楚的是,getSupportActionBar().show() & hide()并不关心您对Toolbar所做的事情以及这些方法调用。此外,Toolbar将被视为您的活动中的任何其他View。记住这些要点,问题归结为 - 我们如何动画隐藏(以及稍后显示)View。由于我们需要使用隐藏(或显示)Toolbar来滑动活动内容,因此我建议执行以下操作。请注意,这只是一个基本的普通程序。你可以肯定地微调这个,或者提出一个完全不同的(阅读更好的)动画过渡:

// holds the original Toolbar height.
// this can also be obtained via (an)other method(s)
int mToolbarHeight, mAnimDuration = 600/* milliseconds */;

ValueAnimator mVaActionBar;

void hideActionBar() {
    // initialize `mToolbarHeight`
    if (mToolbarHeight == 0) {
        mToolbarHeight = mToolbar.getHeight();
    }

    if (mVaActionBar != null && mVaActionBar.isRunning()) {
        // we are already animating a transition - block here
        return;
    }

    // animate `Toolbar's` height to zero.
    mVaActionBar = ValueAnimator.ofInt(mToolbarHeight , 0);
    mVaActionBar.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator animation) {
            // update LayoutParams
            ((AppBarLayout.LayoutParams)mToolbar.getLayoutParams()).height
                    = (Integer)animation.getAnimatedValue();
            mToolbar.requestLayout();
        }
    });

    mVaActionBar.addListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator animation) {
            super.onAnimationEnd(animation);

            if (getSupportActionBar() != null) { // sanity check
                getSupportActionBar().hide();
            }
        }
    });

    mVaActionBar.setDuration(mAnimDuration);
    mVaActionBar.start();
}

void showActionBar() {
    if (mVaActionBar != null && mVaActionBar.isRunning()) {
        // we are already animating a transition - block here
        return;
    }

    // restore `Toolbar's` height
    mVaActionBar = ValueAnimator.ofInt(0 , mToolbarHeight);
    mVaActionBar.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator animation) {
            // update LayoutParams
            ((AppBarLayout.LayoutParams)mToolbar.getLayoutParams()).height
                    = (Integer)animation.getAnimatedValue();
            mToolbar.requestLayout();
        }
    });

    mVaActionBar.addListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationStart(Animator animation) {
            super.onAnimationStart(animation);

            if (getSupportActionBar() != null) { // sanity check
                getSupportActionBar().show();
            }
        }
    });

    mVaActionBar.setDuration(mAnimDuration);
    mVaActionBar.start();
}

在评论中,您提到了I do see an animation now but the space still gets reserved for the toolbar until ab.hide() happens。对我而言,这意味着您使用AppBarLayout来托管Toolbar。如果不是这样,请告诉我,我们会想出一些事情。

最后,将根据以下内容调度对这些方法的调用:

if (getSupportActionBar().isShowing()) {
    hideActionBar();
} else {
    showActionBar();
}

答案 1 :(得分:6)

您可以在xml中使用以下代码,即,当您调用hide / show时,工具栏父级可以为其设置动画。

android:animateLayoutChanges="true"

或者这个

隐藏

toolbarParent.animate().translationY(-toolbarHeight).setInterpolator(new AccelerateInterpolator(2)).start();

<强>显示

toolbarParent.animate().translationY(0).setInterpolator(new DecelerateInterpolator(2)).start();

答案 2 :(得分:3)

如果您使用默认动画隐藏或显示,请尝试:

在您的父android:animateLayoutChanges="true"中添加toolbar在这种情况下AppBarLayout

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay"
    android:animateLayoutChanges="true">

    <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"

        />

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

切换hideshow

的代码
final ActionBar actionBar = getSupportActionBar();

if (actionBar != null) {

    if (actionBar.isShowing()) {
        actionBar.hide();
    } else {
        actionBar.show();
    }

}

答案 3 :(得分:0)

我建议你试试cheesesquare样本。这是一个崩溃的布局。扩展工具栏。

Building native extensions.  This could take a while...
ERROR:  Error installing nokogiri:
    ERROR: Failed to build gem native extension.

    current directory: /Users/username/.rbenv/versions/2.0.0-p481/lib/ruby/gems/2.0.0/gems/nokogiri-1.6.6.4/ext/nokogiri
/Users/username/.rbenv/versions/2.0.0-p481/bin/ruby -r ./siteconf20151127-29540-11ahx4h.rb extconf.rb
checking if the C compiler accepts ... *** extconf.rb failed ***
Could not create Makefile due to some reason, probably lack of necessary
libraries and/or headers.  Check the mkmf.log file for more details.  You may
need configuration options.

Provided configuration options:
    --with-opt-dir
    --without-opt-dir
    --with-opt-include
    --without-opt-include=${opt-dir}/include
    --with-opt-lib
    --without-opt-lib=${opt-dir}/lib
    --with-make-prog
    --without-make-prog
    --srcdir=.
    --curdir
    --ruby=/Users/username/.rbenv/versions/2.0.0-p481/bin/ruby
    --help
    --clean
/Users/username/.rbenv/versions/2.0.0-p481/lib/ruby/2.0.0/mkmf.rb:434:in `try_do': The compiler failed to generate an executable file. (RuntimeError)
You have to install development tools first.
    from /Users/username/.rbenv/versions/2.0.0-p481/lib/ruby/2.0.0/mkmf.rb:549:in `block in try_compile'
    from /Users/username/.rbenv/versions/2.0.0-p481/lib/ruby/2.0.0/mkmf.rb:500:in `with_werror'
    from /Users/username/.rbenv/versions/2.0.0-p481/lib/ruby/2.0.0/mkmf.rb:549:in `try_compile'
    from extconf.rb:80:in `nokogiri_try_compile'
    from extconf.rb:87:in `block in add_cflags'
    from /Users/username/.rbenv/versions/2.0.0-p481/lib/ruby/2.0.0/mkmf.rb:599:in `with_cflags'
    from extconf.rb:86:in `add_cflags'
    from extconf.rb:337:in `<main>'

To see why this extension failed to compile, please check the mkmf.log which can be found here:

  /Users/username/.rbenv/versions/2.0.0-p481/lib/ruby/gems/2.0.0/extensions/x86_64-darwin-14/2.0.0-static/nokogiri-1.6.6.4/mkmf.log

extconf failed, exit code 1

Gem files will remain installed in /Users/username/.rbenv/versions/2.0.0-p481/lib/ruby/gems/2.0.0/gems/nokogiri-1.6.6.4 for inspection.
Results logged to /Users/username/.rbenv/versions/2.0.0-p481/lib/ruby/gems/2.0.0/extensions/x86_64-darwin-14/2.0.0-static/nokogiri-1.6.6.4/gem_make.out

答案 4 :(得分:0)

如果您在活动中使用CoordinatorLayout,请使用:

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    app:layout_scrollFlags="scroll|enterAlways" />

当用户向下滚动列表时,app:layout_scrollFlags="scroll|enterAlways"行将导致我们的工具栏滚出屏幕,一旦他开始向上滚动,工具栏就会再次显示。