- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
所以这就是我想要实现的,是一个回收者 View 使用 3x3 网格,当项目超过 3x3 时,它们会溢出到下一个屏幕/页面。
所以我使用了水平滚动的recyclerview
这是我目前取得的成就
当项目数为 7 及以上时,我当前的代码确实有效。
当计数低于 7 时,我面临需要帮助的问题。
将我的问题列为问题
问题 1:
为什么 recyclerview 项目以垂直方式填充?
1 4
2 5
3 6
我已将我的 recyclerview 设置为水平滚动,
new GridLayoutManager(this, span, GridLayoutManager.HORIZONTAL, false);
问题 2:
当我的项目数是 6 时,如何避免行与行之间的空格?
问题 3:
当我的项目是 4 时,我想将我的项目显示为
1 2 3
4
或
1 3 4
2
当前显示为
如果我将 span 设置为 1,我会将网格设置为
1 2 3 4
导致 4 像这样离开屏幕
1 2 3 |4
我想避免。
==============
我使用的代码
布局:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="88dp"
android:layout_height="88dp"
android:gravity="center"
android:layout_margin="10dp"
android:background="@drawable/border"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:background="@android:color/darker_gray"
android:orientation="vertical"
android:weightSum="1">
<TextView
android:id="@+id/lblTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="TEST"
android:textSize="20sp" />
<TextView
android:id="@+id/lblDesc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/lblTitle"
android:layout_centerHorizontal="true"
android:text="TEST"
android:textSize="13sp" />
</RelativeLayout>
</LinearLayout>
适配器:
public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.CustomViewHolder> {
Context ctx;
List<String> listText;
public class CustomViewHolder extends RecyclerView.ViewHolder {
TextView lblText;
public CustomViewHolder(View view) {
super(view);
view.setClickable(true);
lblText = (TextView) view.findViewById(R.id.lblDesc);
}
}
public RecyclerViewAdapter(Context ctx, List<String> listText) {
this.ctx = ctx;
this.listText = listText;
}
@Override
public RecyclerViewAdapter.CustomViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View itemView = LayoutInflater.from(parent.getContext())
.inflate(R.layout.recycler_child_row, parent, false);
return new CustomViewHolder(itemView);
}
@Override
public void onBindViewHolder(CustomViewHolder holder, int position) {
holder.lblText.setText(listText.get(position));
}
@Override
public int getItemCount() {
return listText.size();
}
}
Activity
public class MainActivity extends AppCompatActivity {
private RecyclerView recyclerTest;
private GridLayoutManager gridLayoutRecyclerview;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
recyclerTest = (RecyclerView) findViewById(R.id.recyclerTest);
List<String> items = Arrays.asList("1", "2", "3", "4");
/*List<String> items = Arrays.asList("1", "2", "3", "4", "5");*/
/*List<String> items = Arrays.asList("1", "2", "3", "4", "5", "6", "7");*/
/*List<String> items = Arrays.asList("1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11");*/
/*List<String> items = Arrays.asList("1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13","14");*/
/*List<String> items = Arrays.asList("1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11","12","13","14","15");*/
/*List<String> items = Arrays.asList("1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11","12","13","14","15","16","17");*/
int span = 0;
if (items.size() <= 3) {
span = 1;
} else if (items.size() <= 6) {
span = 2;
} else {
span = 3;
}
gridLayoutRecyclerview = new GridLayoutManager(this, span, GridLayoutManager.HORIZONTAL, false);
recyclerTest.setLayoutManager(gridLayoutRecyclerview);
SnapHelper snapHelper = new GravitySnapHelper(Gravity.START);
snapHelper.attachToRecyclerView(recyclerTest);
recyclerTest.setAdapter(new RecyclerViewAdapter(this, items));
}
}
最佳答案
Why is the recyclerview items populated in vertical fashion?
1 4
2 5
3 6
RecyclerView 适用于滚动的列表。如果您有水平布局,它将填充第一列,然后是第二列,然后是第三列,等等。毕竟,这就是我们期望列表的工作方式。这就是“编号已关闭”的原因。它从第一列开始,填满后继续下一列。
When my item count is 6 , how do i avoid the space between the rows?
我不知道你的设置,但我猜你的 recyclerviews 高度设置为 match_parent
,所以它可能只是用完了所有可用的高度。 recyclerview 的 wrap_content
高度可能会有所帮助。
When my items are say 4 ,i want to show my items as
1 2 3
4or
1 3 4
2
同样,参见上文,这不是 RecyclerView 的工作方式。它总是一一填充列,而不是从一行开始。列数为 2 的 4 个项目将始终首先填充第一列,如下所示。
1 3
2 4
RecyclerView 可能无法满足您的所有需求。您可以切换到具有3 列且少于 9 个项目的垂直 网格布局。这样它就不会水平滚动,甚至会像您描述的那样填满 View 。对于超过 9 个项目,您仍然会显示水平版本并让它滚动。
您实际上描述的是自定义布局:您想要一个以特定方式运行的 View 。您可以查看如何创建自己的 ViewGroup
并使用它来按您喜欢的方式布置所有 View 。除非您想显示长列表,否则这可能是一个不错的替代选择。
关于android - Recyclerview 水平跨度和间距问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46206283/
这就是我现在正在做的事情。我在设计中使用 LESS CSS。我需要在指定输入之间放置 2 个跨度。所有元素的宽度都应为 100%。跨度应始终为 20px 宽度输入宽度可以根据屏幕宽度进行更改。谁能帮帮
我有一个包含文本和输入字段的跨度。我想知道是否可以让文本左对齐,输入字段右对齐。 NAME: .textBox{ display:inline-block; width:450px
我有这个按钮,我想让它在我点击“选择”时调用方法,在我点击“更改”时调用另一个方法: Select Change 我尝试输入 (click)="method()",但没有成功。我很
我正在开发聊天应用程序 (cordova),当我要在无法输入的表情符号后输入文本时,我在这段代码中遇到了问题 https://output.jsbin.com/radaref This i
很抱歉,如果这是一个非常愚蠢的问题,但我是一名开发人员,目前我的设计技能很少,我在个人网站上工作并且遇到了一个小问题。 我有一个带 ul 的顶部导航和 li元素。这些元素包含链接 . 跨度仅在链接悬
fiddle :https://jsfiddle.net/burz4g8s/4/ 我的 HTML 包含多行双按钮对。服务器端应用程序在 JSP 循环中输出按钮,所以我无法控制各个按钮——我不能使用 d
TextView.setLetterSpacing允许设置字母间距/字符间距。 有没有对应的CharacterStyle / span class允许在 TextView? 中的文本子集上设置字母间距
如何使洋红色矩形比红色矩形短 6 倍? GridLayout { id: gridLayout anchors.fill: parent flo
我最近开始使用 Twitter Bootstrap,但我似乎无法理解 span 的作用以及为什么会有不同的编号 span,例如 span4、span12?什么是偏移量以及它们何时使用? (有时与跨度一
我正在尝试构建一个 jQuery 函数来计算跨度中的总数 var sumnormaltotal = 0; $('span[id^="normaloffertotalspan"]').each(func
我想知道haskell如何评估以下表达式。 span (`elem` ['A'..'Z']) "BOBsidneyMORGANeddy" 结果是 ("BOB","sidneyMORGANeddy")
我有三个词,我想在第一个空格之后的内容周围添加一个跨度,所以 hello world 变成: hello world 和: hello world again 变成: hello world agai
我正在寻找纯 CSS 解决以下问题的方法。 考虑以下 HTML: Some text Some text 两者都是 正在显示元素 inline-block .如何在第二个 的左侧
如何将 Span 放置在其容器的底部? 我目前拥有的:http://jsfiddle.net/wRbax/2/ 我希望 .box 始终位于 .td 的底部 CSS .td { vertical
我试图在 li 中 float 两个 span。左跨度将有我的标签,在右跨度内我将构建一个具有嵌套跨度的图形。我有基本结构,但 chrome 将数字放在左侧跨度的末尾。我该如何解决这个问题? HTML
我有一个像这样的 JavaScript 变量: var text = "A businessman should be able to manage his business matters"; 我想
一些内容可编辑的框与其他框重叠,因此并非所有框都是可编辑的。我想保留与跨度位置中心对齐的文本,如下所示。我如何实现这一点? span { margin: auto; text-alig
我正在使用 WYSIWYG (InnovaEditor) 来编辑我网站上的内容,它适用于 Chrome、IE,主要适用于 Firefox,但 FF 有一个稍微令人讨厌的问题。我将 span 标签插入到
这是我的 html: Settings Export Import 和CSS: span.button { float:right; margin-righ
这里是问题所在:http://jsfiddle.net/STG22/3/ 我希望 span 不会分成两个不同的行(就像上面示例中的第三行一样)。我该怎么做? CSS: span { backg
我是一名优秀的程序员,十分优秀!