使水平回收者视图项的宽度为屏幕宽度的70%

时间:2016-07-29 07:54:02

标签: android xml android-layout

我正在尝试创造这种效果

Design image

我正在使用回收者视图,但我的问题是每张卡片的宽度是屏幕宽度的100%,为70%。

以下是每个项目的xml代码

<style>
    body{
        position:relative;
    }
    #copyright{
        position:absolute;
        top:5%;
    }
</style>

<body>
    <h1> Welcome to my website. </h1>
    <p id="copyright"> Copyright 2016 </p>
</body>

6 个答案:

答案 0 :(得分:11)

如果您希望第一项左对齐(即重现屏幕截图中的内容),请子类LinearLayoutManager并重写三个generate*LayoutParams方法。这是我的操作方法:https://gist.github.com/bolot/6f1838d29d5b8a87b5fcadbeb53fb6f0

class PeekingLinearLayoutManager : LinearLayoutManager {
    @JvmOverloads
    constructor(context: Context?, @RecyclerView.Orientation orientation: Int = RecyclerView.VERTICAL, reverseLayout: Boolean = false) : super(context, orientation, reverseLayout)

    constructor(context: Context, attrs: AttributeSet, defStyleAttr: Int, defStyleRes: Int) : super(context, attrs, defStyleAttr, defStyleRes)

    override fun generateDefaultLayoutParams() =
        scaledLayoutParams(super.generateDefaultLayoutParams())

    override fun generateLayoutParams(lp: ViewGroup.LayoutParams?) =
        scaledLayoutParams(super.generateLayoutParams(lp))

    override fun generateLayoutParams(c: Context?, attrs: AttributeSet?) =
        scaledLayoutParams(super.generateLayoutParams(c, attrs))

    private fun scaledLayoutParams(layoutParams: RecyclerView.LayoutParams) =
        layoutParams.apply {
            when(orientation) {
                HORIZONTAL -> width = (horizontalSpace * ratio).toInt()
                VERTICAL -> height = (verticalSpace * ratio).toInt()
            }
        }

    private val horizontalSpace get() = width - paddingStart - paddingEnd

    private val verticalSpace get() = width - paddingTop - paddingBottom

    private val ratio = 0.9f // change to 0.7f for 70%
}

此解决方案是基于线性布局管理器https://gist.github.com/heinrichreimer/39f9d2f9023a184d96f8的跨距(即,使所有项目适合屏幕)/受其启发。

顺便说一句,如果您只想在当前项目居中时向左和向右显示项目,则可以在回收者视图中添加填充并将clipToPadding设置为false。在这种情况下,您甚至不需要自定义布局管理器。

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recycler_view"
    android:paddingStart="16dp"
    android:paddingEnd="16dp"
    android:clipToPadding="false"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager">

答案 1 :(得分:10)

真正做到这两点的方法。

1)为循环视图使用自定义视图。覆盖onMeasure,将其宽度恢复为屏幕的70%。

2)在您的Recycler View适配器中,创建视图时,将其宽度设置为屏幕宽度的70%。

在任何一种情况下,您都可以从人机界面获取屏幕尺寸,并将宽度乘以.7。在第一种情况下,您将其设置为EXACT测量宽度,在第二种情况下,您将其设置为布局参数。第二个可能有点容易。

答案 2 :(得分:4)

我有一个类似的问题,我有一个带有水平RecyclerView的片段,并希望每个视图项的宽度是用户屏幕的三分之一。通过在ViewHolder类的构造函数中添加以下内容来解决它:

    private class OurViewHolder extends RecyclerView.ViewHolder {
        ...

        public OurViewHolder (LayoutInflater inflater, ViewGroup parent) {
            super (inflater.inflate (R.layout.list_item_layout, parent, false));

            // This code is used to get the screen dimensions of the user's device
            DisplayMetrics displayMetrics = new DisplayMetrics();
            getActivity().getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
            int width = displayMetrics.widthPixels;
            int height = displayMetrics.heightPixels;

            // Set the ViewHolder width to be a third of the screen size, and height to wrap content
            itemView.setLayoutParams(new RecyclerView.LayoutParams(width/3, RecyclerView.LayoutParams.WRAP_CONTENT));

            ...
        }

        ...

答案 3 :(得分:0)

我需要在水平RecyclerView中放置项目,使其占Recyclerview宽度的70%。可以在onCreateViewHolder()中轻松完成:

override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view = LayoutInflater.from(context).inflate(R.layout.row, parent, false);
        view.layoutParams = ViewGroup.LayoutParams((parent.width * 0.7).toInt(),ViewGroup.LayoutParams.MATCH_PARENT)
        return ViewHolder(view);
    }

Result

答案 4 :(得分:0)

对于row.xml父对象,必须使用wrap_content作为其宽度,然后添加此属性。

android:paddingLeft="25dp"

您将得到相同的结果

答案 5 :(得分:-6)

尝试使用LinearLayout更改PercentRelativeLayout以“包裹”RecyclerView,然后将其宽度设置为70%。

改变这个:

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

    <android.support.v7.widget.RecyclerView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/rv"
        />

</LinearLayout>

有了这个:

<android.support.percent.PercentRelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

        <android.support.v7.widget.RecyclerView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            app:layout_widthPercent="70%"
            android:id="@+id/rv"
            />

修改

由于Percent Support Library随附Android支持库23,因此请确保您已将SDK Manager中的Android支持库更新到最新版本(实际上是24)。然后在build.gradle文件中添加如下所示的依赖项:

compile 'com.android.support:percent:24.0.0'