如何根据设备有效地更改布局

时间:2018-08-27 17:12:17

标签: java android xml listview android-adapter

最有效的方法是,对我的活动第一项使用相同的点击事件来调整布局?我只见过thisenter image description here,但他们不能完全解决问题。

当前电话代码 XML(activity_main.xml)

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

    <ListView
        android:id="@+id/my_listView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</RelativeLayout>

Java

public class MainActivity extends Activity implements MyRecyclerViewAdapterGL.ItemClickListener, MyRecyclerViewAdapterLL.ItemClickListener {

    MyRecyclerViewAdapterGL adapterGL;
    MyRecyclerViewAdapterLL adapterLL;

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

        // data to populate the RecyclerView with
        String[] dataArray = {"Item A", "Item B", "Item C", "Item D" ,"Item E" ,"Item F"};


        // set up the RecyclerView (phones)
        RecyclerView recyclerViewLL = findViewById(R.id.recyclerView_list);
        recyclerViewLL.setLayoutManager(new LinearLayoutManager(this));
        adapterLL = new MyRecyclerViewAdapterLL(this, dataArray);
        adapterLL.setClickListener(this);
        recyclerViewLL.addItemDecoration(new DividerItemDecoration(this, LinearLayout.VERTICAL));
        recyclerView.setAdapter(adapterLL);


        // set up the RecyclerView (sw600dp)
        RecyclerView recyclerViewGL = findViewById(R.id.recyclerView_list);
        int numberOfColumns = 2;
        recyclerViewGL.setLayoutManager(new GridLayoutManager(this, numberOfColumns));
        adapterGL = new MyRecyclerViewAdapterGL(this, dataArray);
        adapterGL.setClickListener(this);
        recyclerViewGL.setAdapter(adapterGL);
    }

    @Override
    public void onItemClick(View view, int position) {
    }
}

当前电话结果

enter image description here

以前使用的平板电脑代码(sw600dp / activity_main.xml)

<?xml version="1.0" encoding="utf-8"?>
<TableLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/listview_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:stretchColumns="*"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin">
    <TableRow
        android:id="@+id/MainActivity_tableRow0"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dp" >


        <Button
            android:id="@+id/MainActivity_btn0"
            android:layout_column="0"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginEnd="10dp"
            android:gravity="start|center_vertical"
            android:padding="30dp"
            android:text="Item A"
            android:textAllCaps="false"
            android:textColor="?android:attr/textColorPrimary"
            style="@style/TextAppearance.AppCompat.Large"
            />

        <Button
            android:id="@+id/MainActivity_btn1"
            android:layout_column="1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginStart="10dp"
            android:gravity="start|center_vertical"
            android:padding="30dp"
            android:text="Item B"
            android:textAllCaps="false"
            android:textColor="?android:attr/textColorPrimary"
            style="@style/TextAppearance.AppCompat.Large"
            />
    </TableRow>

    <TableRow
        android:id="@+id/MainActivity_tableRow1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dp" >

        <Button
            android:id="@+id/MainActivity_btn2"
            android:layout_column="0"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginEnd="10dp"
            android:gravity="start|center_vertical"
            android:padding="30dp"
            android:text="Item C"
            android:textAllCaps="false"
            android:textColor="?android:attr/textColorPrimary"
            style="@style/TextAppearance.AppCompat.Large"
            />

        <Button
            android:id="@+id/MainActivity_btn3"
            android:layout_column="1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginStart="10dp"
            android:gravity="start|center_vertical"
            android:padding="30dp"
            android:text="Item D"
            android:textAllCaps="false"
            android:textColor="?android:attr/textColorPrimary"
            style="@style/TextAppearance.AppCompat.Large"
            />
    </TableRow>

    <TableRow
        android:id="@+id/MainActivity_tableRow2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/MainActivity_btn4"
            android:layout_column="0"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginEnd="10dp"
            android:gravity="start|center_vertical"
            android:padding="30dp"
            android:text="Item E"
            android:textAllCaps="false"
            android:textColor="?android:attr/textColorPrimary"
            style="@style/TextAppearance.AppCompat.Large"
            />

        <Button
            android:id="@+id/MainActivity_btn5"
            android:layout_column="1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginStart="10dp"
            android:gravity="start|center_vertical"
            android:padding="30dp"
            android:text="Item G"
            android:textAllCaps="false"
            android:textColor="?android:attr/textColorPrimary"
            style="@style/TextAppearance.AppCompat.Large"
            />
    </TableRow>
</TableLayout>

预期的平板电脑结果

enter image description here

当前平板电脑结果

https://jsfiddle.net/cgxwzdy0/242/

values / bools.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <bool name="my_boolean_value">true</bool>
</resources>

values-sw600dp / bools.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <bool name="my_boolean_value">true</bool>
</resources>

1 个答案:

答案 0 :(得分:1)

您可以将RecyclerView与两个不同的LayoutManagerLinearLayoutGridLayout)一起使用。 为了确定设备的大小,您需要评估一个布尔型资源,您可以根据屏幕大小为其提供不同的值。

res / values / bools.xml

<bool name="is_screen_small">true</bool>

res / values-sw600dp / bools.xml

<bool name="is_screen_small">false</bool>

onCreate()中,您使用boolean变量来检索这样的值:

boolean isScreenSmall = getResources().getBoolean(R.bool.is_screen_small);

由于运行时会将正确的值交给您,因此您可以使用它来设置具有正确的RecyclerView的{​​{1}}:

LayoutManager

请注意,两种屏幕尺寸我都使用相同的RecyclerView recyclerView = findViewById(R.id.recyclerView_list); LayoutManager layoutManager; if(isScreenSmall){ layoutManager = new LinearLayoutManager(this); // maybe use special ItemDecoration for small devices } else{ int numberOfColumns = 2; layoutManager = new GridLayoutManager(this, numberOfColumns); // maybe use special ItemDecoration for large devices } recyclerView.setLayoutManager(layoutManager); MyAdapter adapter = new MyAdapter(this, dataArray); adapter.setClickListener(this); recyclerView.setAdapter(adapter); RecyclerView。如果我可以保证列表项的宽度不会太宽(许多列表都是这种情况),这将起作用。

由于“正常”屏幕的宽度可能仅为RecyclerView.Adapter,并且应该为320dp的左右边缘留出空间(由于material design guidelines,因此“应该”),因此该列表无论如何,项目的宽度不应大于16dp。但是在屏幕宽度为288dp的设备上,必须使用较宽的页边距(600dp),因此,应以最大宽度为24dp的列表项为目标,然后它们也将适合分为两列的270dp

您还可以避免使用大量的布局文件,而通过为不同的屏幕尺寸提供不同的尺寸值(用于边距,边距,宽度,高度等)来对布局进行一些微调。