在ViewPager中将ImageView作为页面放置:询问更改页面宽度的可能方法

时间:2019-04-21 14:44:28

标签: android kotlin android-viewpager2

我有一个ViewPager,它显示上一页和下一页,但是我想更改未选中页面的边界并使这些页面变小。

此图像显示了这些页面的布局边界:

ViewPAger with page boundaries

我需要减小蘑菇和梨的页面宽度。

getPageWidth方法是我唯一想到的选择:

override fun getPageWidth(position: Int): Float {
        val absPosition = Math.abs(position - startOffset)

        return if (absPosition >= 1) {
            0.5f
        } else {
            0.9f
        }
 }

这会将项目1和2的宽度更改为0.9,并将项目0和> 2'的宽度更改为0.5。我需要不理会当前显示的项目,并删除其余页面的边距。

重要的代码:

override fun instantiateItem(container: ViewGroup, position: Int): Any {
            val img = LayoutInflater.from(this@PagerActivity).inflate(R.layout.profile_image_card, container, false) as ImageView
            img.setImageResource(imageIds[position])
            container.addView(img)
            if (imageIds[position] == R.drawable.choose) {
                img.setOnClickListener {
                    Log.d("PAGER_PARADISE", "clicked on choose image")
                    //TODO: select from gallery
                }
            }

            img.setOnClickListener {
                profilePager?.currentItem = position
            }
            return img
        }

页面转换器(显示其他较小的项目:

override fun transformPage(page: View, position: Float) {
    val absPosition = Math.abs(position - startOffset)
    if (absPosition >= 1) {
        //page.setElevation(baseElevation);
        page.scaleY = smallerScale
        page.scaleX = smallerScale
    } else {
        // This will be during transformation
        //page.setElevation(((1 - absPosition) * raisingElevation + baseElevation));
        page.scaleX = (smallerScale - 1) * absPosition + 1
        page.scaleY = (smallerScale - 1) * absPosition + 1
    }
}

此图像(由图像编辑器制作)可能有助于查看实际所需的结果:

ViewPager With different width

编辑:

当我将pageMargin设置为负值(例如-18)时,它们会更接近,但由于currentItem的尺寸较大,它看起来很破碎且未对齐(两个丝束中心之间的间隙项比其他项小

margin to -18

0 个答案:

没有答案