如何在Snackbar中实现此效果

时间:2018-09-08 01:15:47

标签: android animation material-design snackbar

这是gif: enter image description here

有几个功能:

  • 淡入并立即退出。
  • 具有边距。因为默认效果是匹配父级宽度。

现在我已经解决了保证金问题。但是我不知道如何实现动画效果。这是我的代码:

snackbar_animation.xml:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fillAfter="true"
android:shareInterpolator="true">

<alpha
    android:fromAlpha="0.1"
    android:toAlpha="1" />

<scale
    android:fromXScale="0.5"
    android:fromYScale="0.0"
    android:toXScale="1"
    android:toYScale="1"/>

</set>

MainActivity:

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

private Button snackbar;
private CoordinatorLayout coordinatorLayout;

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.snackbar_test);

    coordinatorLayout = findViewById(R.id.coordinator);

    snackbar = findViewById(R.id.show_snackbar);
    snackbar.setOnClickListener(this);
}

@Override
public void onClick(View view) {
    switch (view.getId()){
        case R.id.show_snackbar:
            showSnackbar();
            break;
    }
}

private void showSnackbar(){
    Snackbar snackbar = Snackbar.make(coordinatorLayout,"i am a snack bar",Snackbar.LENGTH_SHORT);

    View sbView = snackbar.getView();

    // add animation
    Animation animation = AnimationUtils.loadAnimation(this,R.anim.snackbar_animation);
    sbView.setAnimation(animation);

    // modify margin
    CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) sbView.getLayoutParams();
    params.setMargins(params.leftMargin + 50,
            params.topMargin,
            params.rightMargin + 50,
            params.bottomMargin + 50);

    sbView.setLayoutParams(params);

    // show snackbar
    snackbar.show();
}

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    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"
    android:id="@+id/coordinator"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <Button
        android:id="@+id/show_snackbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:paddingTop="10dp"
        android:text="show snackbar" />

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

如果您需要进一步了解该问题,请在此问题下方进行评论,例如:有价值的动画或其他内容。我是动画的新手,所以,如果您知道很好的学习材料,请告诉我,谢谢。

1 个答案:

答案 0 :(得分:0)

Read thissetAnimation()仅将动画排队。它实际上并没有启动任何东西。 SnackBar在显示时也不会调用startAnimation

但是,即使您使用startAnimation(),您的代码也可能无法按原样工作。您首先需要将SnackBar的小数位设置为0,这样它才是正确的起始值。

您应该使用SnackBar#setCallback(),然后在onShow()方法内启动放映动画。在onDismiss()方法内设置关闭动画。