将 GridView 调整为所有屏幕尺寸 [英] Adjust GridView to all Screen Sizes
问题描述
我正在尝试将 GridView 实现为图片库的一部分.我遵循了 上使用的布局 XML单独使用 GridView,没有 LinearLayout 并且它在每个屏幕尺寸上以正确的比例显示.这是为什么?为什么当我在我的项目中将 GridView 嵌套在线性布局中时它不能正常工作?
已解决:
我通过编辑 GridView 的 ImageAdapter 解决了这个问题.我计算了生成的图像视图的大小 - 与密度无关.
//为Adapter引用的每一项创建一个新的ImageViewpublic View getView(int position, View convertView, ViewGroup parent) {图像视图图像视图;if (convertView == null) {//计算 ImageView 大小 - 与密度无关.//也许你不应该完全在这个方法中进行这个计算,而是 put 在其他地方.资源 r = Resources.getSystem();float px = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 60, r.getDisplayMetrics());imageView = new ImageView(mContext);imageView.setLayoutParams(new GridView.LayoutParams((int)px,(int)px));imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);//imageView.setPadding(8, 8, 8, 8);imageView.setBackgroundColor(Color.BLUE);} 别的 {imageView = (ImageView) convertView;}imageView.setImageResource(mThumbIds[位置]);返回图像视图;}
Im trying to implement a GridView as part of a image gallery. I followed the following example from the Android developer portal.
The tutorial seems to work for all screen sizes. As you can see below the proportions for a small and a large screen size are displayed correctly (on the left - small screen size, on the right - large screen size.
But now to my problem. When I want to implement exactly the same GridView within a LinearLayout from my Android Project - the correct proportions are gone - as shown by the images below. The pictures begin to overlap so forth and so on.
I am quite sure that this has something to with my LinearLayout which looks like the following.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/widget64"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:id="@+id/widget34"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:background="@drawable/foto_detail_bg_cell_0"
>
<ImageView
android:id="@+id/flyer"
android:layout_width="100dp"
android:layout_height="80dp"
android:src="@drawable/icon"
android:scaleType="centerCrop"
/>
<LinearLayout
android:id="@+id/widget36"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5px"
android:orientation="vertical">
<TextView
android:id="@+id/toptext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Beat.It"
android:textSize="16sp"
android:textStyle="bold"
android:textColor="@color/white"/>
<TextView
android:id="@+id/widget39"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="http://www.google.at"
android:textColor="@color/white"/>
<LinearLayout
android:id="@+id/widget40"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/widget41"
android:layout_width="58dp"
android:layout_height="40dp"
android:src="@drawable/facebook_share"/>
<ImageView
android:id="@+id/widget42"
android:layout_width="58dp"
android:layout_height="40dp"
android:layout_marginLeft="1dp"
android:src="@drawable/photocount"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnWidth="90dp"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center"
/>
</LinearLayout>
The MAIN QUESTION: The Layout XML used by the tutorial on the Android developer portal only uses the GridView alone, without a LinearLayout and and it is shown with correct proportions on each screen size. Why is that? And why does it not work properly when I nest the GridView in a Linear Layout like in my project?
SOLVED:
I solved this issue by editing the ImageAdapter of the GridView. I calculated the size of the generated image views - density independent.
// create a new ImageView for each item referenced by the Adapter
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) {
//Calculation of ImageView Size - density independent.
//maybe you should do this calculation not exactly in this method but put is somewhere else.
Resources r = Resources.getSystem();
float px = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 60, r.getDisplayMetrics());
imageView = new ImageView(mContext);
imageView.setLayoutParams(new GridView.LayoutParams((int)px, (int)px));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
//imageView.setPadding(8, 8, 8, 8);
imageView.setBackgroundColor(Color.BLUE);
} else {
imageView = (ImageView) convertView;
}
imageView.setImageResource(mThumbIds[position]);
return imageView;
}
这篇关于将 GridView 调整为所有屏幕尺寸的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!