图片切换淡入淡出效果「ImageSwitcher无法显示完成图片

项目源码地址，实现效果

实现效果

创建MyImageSwitcher

直入主题，我们想要实现图片的淡入，淡入效果，第一反应就是Android原生的图片切换控件ImageSwitcher，我但实际使用后出现了两点问题

• 无法使用图片加载框架，无法加载网络图片

这是因为它设置图片是在它自己内部的方法完成的，我们查看ImageSwitcher源码的setImageResource方法

   public void setImageResource(@DrawableRes int resid)
    {
        ImageView image = (ImageView)this.getNextView();
        image.setImageResource(resid);
        showNext();
    }

• 竖直方向无法撑满全屏

我沿着ImageSwitcher的父类ViewSwitcher的setFactory()方法，到obtainView方法，发现里面的LayoutParmas确实是撑满全屏的，但是为什么还是没有撑满全屏，这个问题就还不太清楚，解决方案有了，但是原因没找到，如果有清楚的希望分享一下

    private View obtainView() {
        View child = mFactory.makeView();
        LayoutParams lp = (LayoutParams) child.getLayoutParams();
        if (lp == null) {
            //确实层撑满全屏的了
            lp = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
        }
        addView(child, lp);
        return child;
    }

所以既然图片的赋值是在ImageSwitcher里面完成的，那么我们去改它的代码，实现自己的setImage方法不就行了

我们创建MyImageSwitch，让它跟系统的ImageSwitcher一样，去继承于ViewSwitcher实现自己的图片方法

我们先添加一个图片加载Glide的依赖

    // 图片加载框架
    api 'com.github.bumptech.glide:glide:4.8.0'

Activity代码

/**
 * Created by 舍长 on 2019/5/18
 * describe:
 */
class MyImageSwitcher : ViewSwitcher {

    constructor(context: Context) : super(context) {}


    constructor(context: Context, attrs: AttributeSet) : super(context, attrs) {}

    fun setImageResource(resid: Int) {
        val image = this.nextView as ImageView
        //设置图片裁剪模式
        image.scaleType=ImageView.ScaleType.CENTER_CROP
        //设置布局模式
        val lp = LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT)
        image.layoutParams = lp
        //使用Glide进行图片加载
        Glide
            .with(this)
            .load(resid)
            .into(image)
        showNext()
    }


    override fun getAccessibilityClassName(): CharSequence {
        return ImageSwitcher::class.java.name
    }
}

xml布局

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:layout_width="match_parent"
             android:layout_height="match_parent"
             android:orientation="vertical"
>
    
    <!--自定义ImageSwitcher-->
    <com.example.imageswitcher.view.MyImageSwitcher
            android:id="@+id/imageSwitcher"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

    </com.example.imageswitcher.view.MyImageSwitcher>

    <Button
            android:id="@+id/btn_01"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>

</FrameLayout>

Activity

/**
 * Created by 舍长
 * describe:实现图片切换淡入，淡出效果
 */
class MainActivity : AppCompatActivity() {
    var i = 0//控制点击切换图片
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        imageSwitcher.setFactory {
            val imageView= ImageView(this)
            imageView
        }
        //默认显示图片
        setImage1()
        //点击一切换图片，实现淡入，淡出效果
        btn_01.setOnClickListener {
            if (i == 0) {
                setImage1()
                i = 1
            } else {
                i = 0
                setImage2()
            }
        }
    }

    /**
     * 设置图片2
     */
    private fun setImage2() {
        imageSwitcher.setInAnimation(this, android.R.anim.fade_in)
        imageSwitcher.setOutAnimation(this, android.R.anim.fade_out)
        imageSwitcher.setImageResource(R.drawable.iv_recycler_g)
    }

    /**
     * 设置图片1
     */
    private fun setImage1() {
        imageSwitcher.setInAnimation(this, android.R.anim.fade_in)
        imageSwitcher.setOutAnimation(this, android.R.anim.fade_out)
        imageSwitcher.setImageResource(R.drawable.iv_recycler_f)
    }
}

大功告成