添加自定义动画，实现画廊效果

[luXiuKun]

android:clipChildren="false"设置了，宽度也设置了，但是没效果

[lijialian]

同问，怎么实现画廊效果啊？

[luXiuKun]

用viewpager自己实现吧，也不难，实现ViewPager.PageTransformer

[lijialian]

嗯嗯，好的，多谢提示，我试试

[jijunpeng]

写了一个这个Banner的工具类，用kotlin实现了一个画廊效果

import android.annotation.SuppressLint
import android.view.View
import android.widget.RelativeLayout
import com.youth.banner.Banner
import com.youth.banner.transformer.ABaseTransformer
import com.youth.banner.view.BannerViewPager
import kotlin.math.absoluteValue

/**
 * @author jijunpeng created on 2018/2/28.
 */
object BannerUtil {
    @SuppressLint("ClickableViewAccessibility")
    fun galleryStyle(banner: Banner, bannerWidthScale: Float = 0.7F, bannerItemScale: Float = 0.8F, bannerItemSpaceScale: Float = 0.1F) {
        val bannerViewPager = banner.findViewById<BannerViewPager>(com.youth.banner.R.id.bannerViewPager)
        bannerViewPager.setPageTransformer(false, ScaleInOutTransformer(bannerItemScale, bannerItemSpaceScale))
        banner.setOffscreenPageLimit(5)
        var bannerWidth = 0
        with(bannerViewPager.layoutParams) {
            this.width = if (this.width <= 0) {
                (banner.context.resources.displayMetrics.widthPixels * bannerWidthScale).toInt()
            } else {
                (this.width * bannerWidthScale).toInt()
            }
            this as RelativeLayout.LayoutParams
            this.addRule(android.widget.RelativeLayout.CENTER_IN_PARENT)
            bannerWidth = this.width
        }
        bannerViewPager.pageMargin = (-bannerItemSpaceScale * bannerWidth).toInt()
        banner.setOnTouchListener { v, event ->
            bannerViewPager.dispatchTouchEvent(event)
        }
    }
}

class ScaleInOutTransformer(private val viewScale: Float = 0.8F, private val marginScale: Float = 0.1F) : ABaseTransformer() {
    override fun onTransform(page: View, position: Float) {
        val scale = calValScale(position)
        page.scaleX = scale
        page.scaleY = scale
        page.pivotY = page.height / 2F
        page.pivotX = page.width / 2f
        page.translationX = marginScale * page.width * position
    }

    private fun calValScale(position: Float): Float {
        return (1 - position.absoluteValue * (1 - viewScale))
    }
}

使用的时候调用BannerUtil.galleryStyle()就行

[danran-php]

@jijunpeng 没有找到bannerViewPager.setPageTransformer，没有bannerViewPager.pageMargin

[jijunpeng]

@danran-php bannerViewPager是一个ViewPager对象，这个对象中有setPageTransformer和pageMargin方法。参见这里https://developer.android.com/reference/android/support/v4/view/ViewPager.html#setPageMargin(int)和这里https://developer.android.com/reference/android/support/v4/view/ViewPager.html#setPageTransformer(boolean,%20android.support.v4.view.ViewPager.PageTransformer,%20int)