Scrolling的GridView控件时，行高搞糟 [英] Gridview row height mess up when scrooling
本文介绍了Scrolling的GridView控件时，行高搞糟的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我使用一个GridView到由两个文本框的present各种商品项目。因为不同数量的文本中的每个项的高度是不同的，一个行应的行的最大项的高度的尺寸。在GridView使用colnum =自动调整。
正如下面的截图前后滚动演出结束后，如预期的行为，因为我向下滚动，再升：行陷入困境，减少大项内容。
我缺少什么？
的GridView的之前滚动：
GridView控件的在滚动向下和向上：
另外code：
项目XML code
＆LT;？XML版本=1.0编码=UTF-8＆GT？;
＆LT;的TextView
机器人：ID =@ + ID /标题
机器人：layout_width =FILL_PARENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_marginLeft =10dp
机器人：layout_marginRight =10dp
机器人：layout_marginTop =14dp
机器人：文字颜色=＃040404
机器人：TEXTSIZE =20SP
机器人：文字样式=大胆
机器人：字体=衬/＆GT;＆LT;的TextView
机器人：ID =@ + ID /文
机器人：layout_width =FILL_PARENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_margin =10dp
机器人：文字颜色=＃343434
机器人：TEXTSIZE =14sp
机器人：字体=衬/＆GT;＆LT; / LinearLayout中＆GT;
我ListAdapter（回收的观点如果可能的话）：
公共类SearchResultListViewAdapter扩展ArrayAdapter
{
上下文的背景下;
报纸报纸;
清单＆LT; SearchResultListItem＆GT;搜索结果;
INT viewStyle;公共SearchResultListViewAdapter（上下文的背景下，INT RESOURCEID，列表与LT; SearchResultListItem＆GT;的SearchResult，诠释viewStyle）{
超（背景下，资源ID，SearchResult所）;
this.context =背景;
this.searchResults =的SearchResult;
this.viewStyle = viewStyle;
}/ *私有视图holder类* /
私有类ViewHolder
{
TextView的txtTitle;
TextView的txtText;
}公共查看getView（INT位置，查看convertView，父母的ViewGroup）
{
查看的GridItem;
ViewHolder支架=无效; 如果（convertView == NULL）
{
LayoutInflater mInflater =（LayoutInflater）context.getSystemService（Activity.LAYOUT_INFLATER_SERVICE）;
如果（this.viewStyle == 0）
{
的GridItem = mInflater.inflate（R.layout.searchresult_list_item，NULL）;
}其他
{
的GridItem = mInflater.inflate（R.layout.searchresult_grid_item，NULL）;
}
持有人=新ViewHolder（）;
}其他{
的GridItem = convertView;
支架=（ViewHolder）gridItem.getTag（）;
} holder.txtText =（TextView中）gridItem.findViewById（R.id.text）;
holder.txtTitle =（TextView中）gridItem.findViewById（R.id.title）;
gridItem.setTag（保持器）;
SearchResultListItem rowItem =的getItem（位置）;
holder.txtText.setText（Html.fromHtml（rowItem.getText（）），TextView.BufferType.SPANNABLE）;
holder.txtTitle.setText（Html.fromHtml（rowItem.getTitle（）），TextView.BufferType.SPANNABLE）; 返回的GridItem;
}
}
最后包含在GridView我的活动布局：
＆LT;？XML版本=1.0编码=UTF-8＆GT？;
＆LT; TableLayout的xmlns：机器人=http://schemas.android.com/apk/res/android
机器人：layout_width =FILL_PARENT
机器人：layout_height =match_parent＆GT;＆LT;的TableRow
机器人：ID =@ + ID / tableRow3
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =match_parent＆GT; ＆LT; RelativeLayout的
机器人：layout_width =match_parent
机器人：layout_height =WRAP_CONTENT
机器人：layout_weight =1＆GT; ＆LT;的EditText
机器人：ID =@ + ID / searchPatternInput
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_alignParentLeft =真
机器人：layout_toLeftOf =@ + ID / loadSearchResults
机器人：imeOptions =actionSearch
安卓的inputType =TEXT/＆GT; ＆LT;的ImageButton
机器人：ID =@ + ID / showExtendedSearch
风格=机器人：ATTR / buttonBarButtonStyle
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_alignParentRight =真
机器人：layout_alignParentTop =真
机器人：SRC =@绘制/ ic_action_filter/＆GT; ＆LT;的ImageButton
机器人：ID =@ + ID / loadSearchResults
风格=机器人：ATTR / buttonBarButtonStyle
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_alignParentTop =真
机器人：layout_toLeftOf =@ + ID / showExtendedSearch
机器人：SRC =@绘制/ ic_action_search/＆GT;
＆LT; / RelativeLayout的＆GT;
＆LT; /＆的TableRow GT;＆LT;的TableRow
机器人：ID =@ + ID / tableRow2
机器人：layout_width =match_parent
机器人：layout_height =match_parent＆GT; ＆LT; RelativeLayout的
的xmlns：机器人=http://schemas.android.com/apk/res/android
机器人：layout_width =0dp
机器人：layout_height =FILL_PARENT
机器人：layout_weight =1
机器人：背景=＃FFFFFF＆GT; ＆LT; ImageSwitcher
机器人：ID =@ + ID / nothingLoaded
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_centerInParent =真
机器人：背景=@绘制/ ic_nothing_loaded＆GT;
＆LT; / ImageSwitcher＆GT; ＆LT;的LinearLayout
机器人：layout_width =match_parent
机器人：layout_height =match_parent
机器人：layout_alignParentTop =真正的＆GT; ＆LT; GridView控件
机器人：ID =@ + ID / searchResultThumbnailsGridView
机器人：layout_width =match_parent
机器人：layout_height =match_parent
机器人：columnWidth时=160dp
机器人：分=＃b5b5b5
机器人：dividerHeight =1DP
机器人：比重=中心
机器人：horizontalSpacing =4DP
机器人：listSelector =@绘制/ list_selector
机器人：为numColumns =auto_fit
机器人：填充=10dp
机器人：layout_weight =1
机器人：stretchMode =columnWidth时
机器人：verticalSpacing =4DP/＆GT; ＆LT; / LinearLayout中＆GT;
＆LT; / RelativeLayout的＆GT;
＆LT; /＆的TableRow GT;＆LT; / TableLayout＆GT;
解决方案
我转移到使用第三方组件。在 StaggeredGridView workes对我很好，了解更多信息，可以发现
I'm using a gridview to present various article items consisting of two textfield. Because of different amount of text the height of each item is different and a row should be sized with the height of the biggest item of a row. The gridview uses colnum = autofit.
As the following screenshot before and after scrolling show, the behaviour is as expected since i scroll down and up again: Rows mess up and cut content of big items. What am I missing?
Gridview before scrolling:
GridView after scrolling down and up:
Further code:
item xml code
<?xml version="1.0" encoding="utf-8"?>
<TextView
android:id="@+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="14dp"
android:textColor="#040404"
android:textSize="20sp"
android:textStyle="bold"
android:typeface="serif" />
<TextView
android:id="@+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:textColor="#343434"
android:textSize="14sp"
android:typeface="serif" />
</LinearLayout>
My ListAdapter (recycles views if possible):
public class SearchResultListViewAdapter extends ArrayAdapter {
Context context;
Newspaper newspaper;
List<SearchResultListItem> searchResults;
int viewStyle;
public SearchResultListViewAdapter(Context context, int resourceId, List<SearchResultListItem> searchResults, int viewStyle) {
super(context, resourceId, searchResults);
this.context = context;
this.searchResults = searchResults;
this.viewStyle = viewStyle;
}
/* private view holder class */
private class ViewHolder
{
TextView txtTitle;
TextView txtText;
}
public View getView(int position, View convertView, ViewGroup parent)
{
View gridItem;
ViewHolder holder = null;
if (convertView == null)
{
LayoutInflater mInflater = (LayoutInflater) context.getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
if (this.viewStyle == 0)
{
gridItem = mInflater.inflate(R.layout.searchresult_list_item, null);
} else
{
gridItem = mInflater.inflate(R.layout.searchresult_grid_item, null);
}
holder = new ViewHolder();
} else {
gridItem = convertView;
holder = (ViewHolder) gridItem.getTag();
}
holder.txtText = (TextView) gridItem.findViewById(R.id.text);
holder.txtTitle = (TextView) gridItem.findViewById(R.id.title);
gridItem.setTag(holder);
SearchResultListItem rowItem = getItem(position);
holder.txtText.setText(Html.fromHtml(rowItem.getText()), TextView.BufferType.SPANNABLE);
holder.txtTitle.setText(Html.fromHtml(rowItem.getTitle()), TextView.BufferType.SPANNABLE);
return gridItem;
}
}
And finally my activity layout containing the gridview:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="match_parent" >
<TableRow
android:id="@+id/tableRow3"
android:layout_width="wrap_content"
android:layout_height="match_parent" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" >
<EditText
android:id="@+id/searchPatternInput"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="@+id/loadSearchResults"
android:imeOptions="actionSearch"
android:inputType="text" />
<ImageButton
android:id="@+id/showExtendedSearch"
style="?android:attr/buttonBarButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:src="@drawable/ic_action_filter" />
<ImageButton
android:id="@+id/loadSearchResults"
style="?android:attr/buttonBarButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toLeftOf="@+id/showExtendedSearch"
android:src="@drawable/ic_action_search" />
</RelativeLayout>
</TableRow>
<TableRow
android:id="@+id/tableRow2"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ffffff" >
<ImageSwitcher
android:id="@+id/nothingLoaded"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="@drawable/ic_nothing_loaded" >
</ImageSwitcher>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true" >
<GridView
android:id="@+id/searchResultThumbnailsGridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnWidth="160dp"
android:divider="#b5b5b5"
android:dividerHeight="1dp"
android:gravity="center"
android:horizontalSpacing="4dp"
android:listSelector="@drawable/list_selector"
android:numColumns="auto_fit"
android:padding="10dp"
android:layout_weight="1"
android:stretchMode="columnWidth"
android:verticalSpacing="4dp" />
</LinearLayout>
</RelativeLayout>
</TableRow>
</TableLayout>
解决方案
I moved on to use a third party component. The StaggeredGridView workes fine for me, more information can be found here.
这篇关于Scrolling的GridView控件时，行高搞糟的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
