时间戳

首页 > 解决方案 > Ionic 4 Capacitor 中原生插件动画的视觉错误

java - Ionic 4 Capacitor 中原生插件动画的视觉错误

问题描述

我目前正在为 Capacitor 开发一个自定义的 android 本机插件。该插件包含在应用程序的页脚中，除了隐藏动画外，该页脚工作正常。

问题是每次显示/隐藏页脚时我都会更改 WebView 边距，这会使黑色（有时是橙色，可能是因为是应用程序的主要颜色之一）条出现在页脚占用的空间中。动画结束后黑条消失。

我尝试在动画开始/结束时更改 WebView 边距，结果是一样的。

在此先感谢各位，这里有一些代码。

动画 XML：

<translate
    android:duration="150"
    android:fromYDelta="0"
    android:toYDelta="100%" />

WebView边距功能：

private void changeWebViewMargin(float pixels) {
    CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) wb.getLayoutParams();
    params.setMargins(0, 0, 0, (int) dpTopixel(getContext(), pixels));
    wb.setLayoutParams(params);
    wb.requestLayout();
}

隐藏功能：

@PluginMethod()
public void hide(PluginCall call) {
    Boolean animated = call.getBoolean("animated");

    if (animated == null) {
        animated = false;
    }

    final boolean finalAnimated = animated;

    this.getBridge().getActivity().runOnUiThread(new Runnable() {
        @Override
        public void run() {
            if (finalAnimated && footer.getVisibility() == View.VISIBLE) {
                changeWebViewMargin(0f);
                Animation myAnim = AnimationUtils.loadAnimation(getBridge().getContext(), R.anim.hide_footer);
                myAnim.setAnimationListener(new Animation.AnimationListener() {
                    @Override
                    public void onAnimationStart(Animation animation) {
                    }

                    @Override
                    public void onAnimationEnd(Animation animation) {
                        footer_img.setVisibility(View.INVISIBLE);
                        footer.setVisibility(View.INVISIBLE);
                        btn3.setVisibility(View.INVISIBLE);
                    }

                    @Override
                    public void onAnimationRepeat(Animation animation) {
                    }
                });
                footer.startAnimation(myAnim);
                footer_img.startAnimation(myAnim);
                btn3.startAnimation(myAnim);
            } else {
                footer_img.setVisibility(View.INVISIBLE);
                footer.setVisibility(View.INVISIBLE);
                btn3.setVisibility(View.INVISIBLE);
                changeWebViewMargin(0f);
            }
        }
    });
}

标签： javaandroidionic-frameworkcapacitor

解决方案

而不是使用边距尝试使用WindowInsets：

ViewCompat.setOnApplyWindowInsetsListener(wb, (v, insets) -> {
    ((ViewGroup.MarginLayoutParams) v.getLayoutParams()).bottomMargin = 
                 insets.getSystemWindowInsetTop() + (int) dpTopixel(getContext(), pixels);
    return insets.consumeSystemWindowInsets();
});

推荐阅读