11

我正在我的应用程序中创建一个活动来显示一堆数据,特别是位置。会有地名、与用户的距离以及与之相关的图像。这部分我已经整理好了。

我想在不同的设备上以不同的方式显示这些信息。在较小的设备(例如电话)上,我希望它们显示在 1 列列表中,左侧是图像,右侧是名称和距离。我已经使用ListView.

但是,在较大的平板电脑上,我想将其显示在网格中,图像是整个单元格(正方形),文本位于图像顶部。

什么是最好的方法。会是 2 个布局,一个ListView和一个GridView,Activity.java 文件将如何检测存在的布局并相应地格式化数据?或者我可以只使用 aGridView并根据屏幕大小动态设置列吗?

4

2 回答 2

29

ListView 和 GridView 都是 AbsListView 的后代。因此,在您的代码中,请参考 AbsListView 的一个实例。然后,正如其他人建议的那样,使用特定的布局文件夹来定义您的布局。您还将在这些布局(ListView 或 GridView)中定义 AbsListView 的特定实例。

如果您使用所有相同的元素名称正确定义布局,则无需更改代码。

编辑:我不确定你为什么会编写代码来做 SDK/OS 会为你做的事情。因此,对于其他偶然发现这一点的人,我想举一个完整的例子来说明如何做到这一点,而不必在你的代码中添加 hack:

完整的、非常基本的项目可以在我的 gitHub 上找到: https ://github.com/sberg413/abslistview-example

MainActivity.java :

package com.example.abslistviewexample;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AbsListView;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;    

public class MainActivity extends Activity {

        AbsListView absListView;

        static String[] listItems = { "First Item", "Second Item", "Third Item",
                "Fourth Item", "Fifth Item", "Sixth Item", "Seventh Item",
                "Eight Item", "Ninth Item", "Tenth Item" };

        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);

            absListView = (AbsListView) findViewById(R.id.listView1);

            absListView.setAdapter( new MyArrayAdapter(this, R.layout.row, listItems));
        }


        private class MyArrayAdapter extends ArrayAdapter<String>{

            public MyArrayAdapter(Context context, int resource,
                    String[] values) {
                super(context, resource, values);   
            }

            @Override
            public View getView(int position, View convertView, ViewGroup parent) {
                LayoutInflater inflater = (LayoutInflater) getContext()
                        .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
                View view = inflater.inflate(R.layout.row, parent, false);
                TextView textView = (TextView) view.findViewById(R.id.textView1);
                ImageView imageView = (ImageView) view.findViewById(R.id.imageView1);

                textView.setText( getItem(position));

                return view;
            }
        }
}

布局/activity_main.xml :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <ListView
        android:id="@+id/listView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true" >

    </ListView>
</RelativeLayout>

布局/row.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="10dp"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/imageView1"
        android:layout_marginLeft="50dp"
        android:layout_toRightOf="@+id/imageView1"
        android:text="TextView" />
</RelativeLayout>

layout-xlarge/activity_main.xml :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <GridView
        android:id="@+id/listView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:numColumns="3" >

    </GridView>
</RelativeLayout>

布局-xlarge/row.xml :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="10dp"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_marginTop="20dp"
        android:text="TextView" />
</RelativeLayout>

这显然是一个非常微不足道的例子,但你会明白的。注意 MainActivity 如何使用 AbsListView。在布局 xmls 中,您可以指定使用哪个子类。

我希望这可以帮助别人。

于 2013-09-25T10:17:47.427 回答
7

你正在做的是完美的方式。为 7 英寸和 10 英寸选项卡和其余列表视图执行 GridView。使用两个不同的布局文件和下面的代码来检测设备是 7 英寸平板电脑还是 10 英寸平板电脑或其他。

public static Double getDiagonalInch(Activity activity)

{

    DisplayMetrics metrics = new DisplayMetrics();

    WindowManager wm = (WindowManager) activity.getSystemService(
            Context.WINDOW_SERVICE);
    wm.getDefaultDisplay().getMetrics(metrics);
      final int measuredwidth = metrics.widthPixels;
      final int measuredheight = metrics.heightPixels;

      final double diagonal = Math.sqrt((measuredwidth * measuredwidth)
        + (measuredheight * measuredheight));


      diaInch = diagonal / metrics.densityDpi;

    return diaInch;

}
if(diaInch<9 && diaInch>=6.5)
        {
            // small tab (7 inch tab)
        }
        else if(diaInch>9)
        {
            // big tab (10 inch tab)
        }
        else
        {
            s2,s3 s4 etc devices
        }
于 2013-09-25T10:17:30.933 回答