Question

https://drive.google.com/open?id=1iCM6GlT-iAXxNWw7qAt165Q1PVWhMrSp
什么是加载（模糊）然后显示图标布局？
如何创建这样的人？

Answer 1

您可以开始检查闪烁效果。这有助于您在执行一些额外工作（或加载某些内容）时将任何项目布局结构显示为占位符

结果：

方法：

首先，将facebook Shimmer库添加到 build.gradle ：

dependencies {
   implementation 'com.facebook.shimmer:shimmer:0.1.0@aar'
}

然后创建您 placeholder_layout.xml ：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginTop="20dp"
    android:layout_marginLeft="10dp">

    <View
        android:id="@+id/thumbnail"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_marginRight="16dp"
        android:layout_marginTop="10dp"
        android:background="#dddddd"/>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/thumbnail"
        android:layout_marginTop="10dp"
        android:orientation="vertical">

        <View
            android:layout_width="100dp"
            android:layout_height="8dp"
            android:background="#dddddd" />
        <View
            android:layout_width="30dp"
            android:layout_height="8dp"
            android:layout_marginTop="5dp"
            android:background="#dddddd" />

    </LinearLayout>

</RelativeLayout>

接下来，在活动布局中，将 ShimmerFrameLayout 与占位符一起添加。

<com.facebook.shimmer.ShimmerFrameLayout
    android:id="@+id/shimmer_view_container"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:layout_marginTop="15dp"
    android:orientation="vertical"
    shimmer:duration="800">

    <!-- Adding 7 rows of placeholders -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <include layout="@layout/data_placeholder_layout" />
        <include layout="@layout/data_placeholder_layout" />
        <include layout="@layout/data_placeholder_layout" />
        <include layout="@layout/data_placeholder_layout" />
        <include layout="@layout/data_placeholder_layout" />
        <include layout="@layout/data_placeholder_layout" />
        <include layout="@layout/data_placeholder_layout" />

    </LinearLayout>

</com.facebook.shimmer.ShimmerFrameLayout>

最后管理何时显示或隐藏 Activity / Fragment 类中的 ShimmerFrameLayout ：

public class MainActivity extends AppCompatActivity {

    private ShimmerFrameLayout mShimmerViewContainer;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mShimmerViewContainer = findViewById(R.id.shimmer_view_container);

        // Stop Shimmer effect whenever you want. e.g. when data 
        // is received from web service 
        mShimmerViewContainer.stopShimmerAnimation();
        mShimmerViewContainer.setVisibility(View.GONE);
    }   

    @Override
    public void onResume() {
        super.onResume();
        mShimmerViewContainer.startShimmerAnimation();
    }

    @Override
    protected void onPause() {
        mShimmerViewContainer.stopShimmerAnimation();
        super.onPause();
    }
}

注意：：当视图不再可见时，请不要忘记启动和停止组件。使用 onResume（）和 onPause（）

希望这对您有所帮助。

来源：https://medium.com/mindorks/android-design-shimmer-effect-fa7f74c68a93

这是什么布局，有关此的任何示例？

1 个答案: