androidTV图文混排的一个解决方案
2020-06-18 本文已影响0人
waiwaaa
目前碰到的一个需求是:一个页面上有文字简介,同时会有视频与图片若干。视频与图片每行排3个,视频与图片不要在同一行显示。
Android官方对TextView的图文混排提供了支持,我们可以从以下三种方式实现TextView的图文混排:
- 1.在TextView中使用Compound Drawable属性,即在文本的四周指定图像
- 2.在TextView中使用Spannable多样式显示;
- 3.在TextView中显示HTML文本,嵌入webview
但这些方式都不适合于tv端,因为图像即video无法获取到焦点,所以无法显示出来。为了得到焦点,这里采用的是recyclerview来做显示,把图像、视频、文本设置成单独对象,然后在recyclerview中显示。由于tv端都是横屏布局,因此layoutManager采用的是GridLayoutManager。
实现的关键点:
1.采用GridLayoutManager布局,文本占满宽度,需要重写SpanSizeLookup
方法。
gridLayoutManager.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup() {
@Override
public int getSpanSize(int position) {
if(list.size()==0)return 1;
return list.get(position).type==3 ? gridLayoutManager.getSpanCount():1;
}
}
);
- 焦点的控制
1.item的布局中,需要加android:focusable="true"
使布局文件可以获得焦点,如果子对象需要获取焦点,你可能需要设置android:descendantFocusability
2.如果文本的长度过大,一屏显示不下的时候,上下切换会导致看不全文本,因此我们需要对按键进行处理来平衡焦点切换与文本滚动。
text.setOnKeyListener(new View.OnKeyListener() {
@Override
public boolean onKey(View view, int i, KeyEvent keyEvent) {
if(keyEvent.getAction()==keyEvent.ACTION_DOWN){
if(keyEvent.getKeyCode()==20||keyEvent.getKeyCode()==130){//down
recyclerView.scrollBy(0,100);
}
}
return false;
}
});
3.关于换行
1.文字的换行没有问题,因为文字本来就占满了整行
2.如果视频的个数不能占满行,下一个图片就需要在下一行显示。我网上查找了一下“GridLayoutManager强制换行”,没有发现可用的方法,最后采用增加空item的方式来实现,数据中增加空数据来显示占用格子来使之满,空的item不设焦点focusable
就不会被选中了。