Android简单而强大的骨骼动画视图

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/u012162503/article/details/78610752

简单而强大的骨骼动画视图 源于国外的开源网站分享给大家。如下图所示：

具体使用如下

Usage:

Step 1:

添加项目 build.gradle 

allprojects {
    repositories {
        ...
        maven { url 'https://jitpack.io' }
    }
}
添加到你App同级目录下的 build.gradle.

dependencies {
      compile 'com.github.rasoulmiri:Skeleton:v1.0.3'
}
Step 2:

在顶部布局上添加名称空间

xmlns:Skeleton="http://schemas.android.com/apk/res-auto" 
Step 3:

在布局中使用SkeletonGroup和SkeletonView

<io.rmiri.skeleton.SkeletonGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

         <io.rmiri.skeleton.SkeletonView ...>
            <View ... />
        </io.rmiri.skeleton.SkeletonView>

        <io.rmiri.skeleton.SkeletonView ...>
            <View ... />
        </io.rmiri.skeleton.SkeletonView>

</io.rmiri.skeleton.SkeletonGroup>

例如:

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:Skeleton="http://schemas.android.com/apk/res-auto"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardBackgroundColor="@color/white"
    app:cardCornerRadius="10dp"
    app:cardElevation="10dp"
    app:cardUseCompatPadding="true"
    app:contentPadding="0dp">

    <io.rmiri.skeleton.SkeletonGroup
        android:id="@+id/skeletonGroup"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        Skeleton:SK_BackgroundViewsColor="#EEEEEE"
        Skeleton:SK_animationAutoStart="true"
        Skeleton:SK_animationDirection="LTR"
        Skeleton:SK_animationDuration="1000"
        Skeleton:SK_animationFinishType="gradient"
        Skeleton:SK_animationNormalType="gradient"
        Skeleton:SK_backgroundMainColor="@android:color/transparent"
        Skeleton:SK_highLightColor="#DEDEDE">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <io.rmiri.skeleton.SkeletonView
                android:id="@+id/skeletonViewPhoto"
                android:layout_width="match_parent"
                android:layout_height="300dp"
                Skeleton:SK_cornerRadius="0dp"
                Skeleton:SK_padding="0dp"
                Skeleton:SK_shapeType="rect">

                <android.support.v7.widget.AppCompatImageView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:scaleType="centerCrop"
                    app:srcCompat="@drawable/photoTest" />

            </io.rmiri.skeleton.SkeletonView>

            <io.rmiri.skeleton.SkeletonView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/skeletonViewPhoto"
                Skeleton:SK_cornerRadius="10dp"
                Skeleton:SK_padding="5dp"
                Skeleton:SK_shapeType="rect">

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_alignParentBottom="true"
                    android:layout_alignParentEnd="true"
                    android:text="Title" />
            </io.rmiri.skeleton.SkeletonView>
        </RelativeLayout>
    </io.rmiri.skeleton.SkeletonGroup>
</android.support.v7.widget.CardView>
Final step

看起来很简单吧，赶快集成起来 ;) .

Configure XML

SkeletonGroup

SK_animationAutoStart: true or false | defult value true
SK_animationDuration: time animation | default 1000 millisecond
SK_animationDirection: RTL,LTR,BTT,TTB | default value is LTR
SK_animationNormalType: none,alpha,gradient | default value is gradient
SK_animationFinishType: none,alpha,gradient | default value is gradient
SK_backgroundMainColor: background total SkeletonGroup
SK_BackgroundViewsColor: background SkeletonViews in this SkeletonGroup
SK_highLightColor: highLight color animation
SkeletonView

SK_shapeType: rect, oval,text | defult value rect
SK_cornerRadius: just use for shape type rect | defult value 0dp
SK_cornerRadiusTopLeft
SK_cornerRadiusTopRight
SK_cornerRadiusBottomLeft
SK_cornerRadiusBottomLRight
SK_padding: padding view if SK_shapeType equals rect | default value is 0dp
SK_paddingTop
SK_paddingRight
SK_paddingLeft
SK_paddingBottom
SK_textLineNumber: just use for shape type text | default value is 3
SK_textLineLastWidth: full, threeQuarters, half, quarter | default value is threeQuarters
SK_textLineHeight: hieght of line | defualt value is 24dp
SK_textLineSpaceVertical: space vertical between lines | default value is threeQuarters 4dp
Configure Java

skeletonGroup.setAutoPlay(true);
skeletonGroup.setShowSkeleton(true);
skeletonGroup.startAnimation();
skeletonGroup.finishAnimation();
 skeletonGroup.setSkeletonListener(new SkeletonGroup.SkeletonListener() {
      @Override
      public void onStartAnimation() {
    ...
      }

      @Override
      public void onFinishAnimation() {
    ...
      }
 });
用于RecyclerView和适配器请参阅此项目中的示例在Activity里面使用

以上就是今天推荐的开源控件，我会不定期更新自己看到的比较不错的控件，谢谢支持。

喜欢的可以关注微信公众号,哪里每天都会推荐一篇开源项目Git项目地址在里欢迎订阅