Linearlayout Imageview设计所有设备

时间:2014-12-20 16:53:07

标签: android android-layout layout android-linearlayout

我如何使用linearlayout查看所有设备相同的视图?我想显示为第一张图片。所有设备上的图像必须相同。

720X1280

enter image description here

1280×800

enter image description here

所有设备屏幕方向纵向视图 总对象25 imageview,8 linearlayout

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#f9f9dd"
            android:orientation="vertical" >

        <LinearLayout android:id="@+id/linearLayout0" 
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:layout_alignParentLeft="true" 
        android:layout_width="fill_parent"
        android:orientation="horizontal">

        </LinearLayout>   

        <LinearLayout
            android:id="@+id/linearLayout1"
            android:layout_width="fill_parent"
            android:layout_height="65dp"
            android:layout_alignParentLeft="true"
            android:orientation="horizontal" >

            <ImageView
                android:id="@+id/imageView1"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView2"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView3"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView4"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView5"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

        </LinearLayout>

        <LinearLayout
            android:id="@+id/linearLayout2"
            android:layout_width="fill_parent"
            android:layout_height="65dp"
            android:layout_alignParentLeft="true"
            android:orientation="horizontal" >

            <ImageView
                android:id="@+id/imageView6"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView7"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView8"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView9"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView10"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

        </LinearLayout>

        <LinearLayout
            android:id="@+id/linearLayout3"
            android:layout_width="fill_parent"
            android:layout_height="65dp"
            android:layout_alignParentLeft="true"
            android:orientation="horizontal" >

            <ImageView
                android:id="@+id/imageView11"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView12"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView13"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView14"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView15"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

        </LinearLayout>

        <LinearLayout
            android:id="@+id/linearLayout4"
            android:layout_width="fill_parent"
            android:layout_height="65dp"
            android:layout_alignParentLeft="true"
            android:orientation="horizontal" >

            <ImageView
                android:id="@+id/imageView16"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView17"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView18"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView19"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView20"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

        </LinearLayout>

        <LinearLayout
            android:id="@+id/linearLayout5"
            android:layout_width="fill_parent"
            android:layout_height="65dp"
            android:layout_alignParentLeft="true"
            android:orientation="horizontal" >

            <ImageView
                android:id="@+id/imageView21"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView22"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView23"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView24"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

            <ImageView
                android:id="@+id/imageView25"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_margin="3dp"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/s2" />

        </LinearLayout>

        <LinearLayout android:id="@+id/linearLayout6" 
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:layout_alignParentLeft="true" 
        android:layout_width="fill_parent"
        android:orientation="horizontal">

            <ImageView
                android:id="@+id/imageView26"
                android:layout_width="75dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:src="@drawable/left" />

            <TextView
                android:id="@+id/textView1"
                android:layout_width="10dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:text="1"
                android:textAlignment="center"
                android:textAppearance="?android:attr/textAppearanceLarge" />

            <ImageView
                android:id="@+id/imageView27"
                android:layout_width="75dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:src="@drawable/right" />

        </LinearLayout>

        </LinearLayout>

2 个答案:

答案 0 :(得分:0)

尝试使用weighSumweight,如:

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:weightSum="5">

    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        />

      <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="3"
        />

      <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        />
</LinearLayout>

请参阅此链接:http://developer.android.com/reference/android/widget/LinearLayout.html#attr_android:weightSum

希望它会有所帮助。

答案 1 :(得分:0)

您可以使用ConstraintLayout在屏幕中间创建一个正方形,然后将按钮和文本标签放在该正方形下方来解决此问题。无论屏幕大小如何,中间的正方形始终与宽度一样高,并且始终会填满屏幕宽度。

请注意,这意味着如果屏幕横向放置,则顶部和底部将不可见。

我将内容分解为较小的布局文件,可以将它们<include>相互编排,以使内容尽可能地可读。

  • cell.xml
<View
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:layout_margin="1dp"
    android:background="#7fc9a1"/>
  • row.xml
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:orientation="horizontal">

    <include layout="@layout/cell"/>
    <include layout="@layout/cell"/>
    <include layout="@layout/cell"/>
    <include layout="@layout/cell"/>
    <include layout="@layout/cell"/>

</LinearLayout>
  • activity_main.xml
<androidx.constraintlayout.widget.ConstraintLayout
    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"
    android:background="#ffd">

    <LinearLayout
        android:id="@+id/container"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="vertical"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintDimensionRatio="1:1">

        <include layout="@layout/row"/>
        <include layout="@layout/row"/>
        <include layout="@layout/row"/>
        <include layout="@layout/row"/>
        <include layout="@layout/row"/>

    </LinearLayout>

    <ImageView
        android:id="@+id/back"
        android:layout_width="75dp"
        android:layout_height="60dp"
        android:layout_marginLeft="48dp"
        app:layout_constraintTop_toBottomOf="@+id/container"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/label"
        app:srcCompat="@drawable/ic_chevron_left_black_24dp"/>

    <TextView
        android:id="@+id/label"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:paddingLeft="30dp"
        android:paddingRight="30dp"
        app:layout_constraintTop_toBottomOf="@+id/container"
        app:layout_constraintLeft_toRightOf="@+id/back"
        app:layout_constraintRight_toLeftOf="@+id/forward"
        tools:text="1"/>

    <ImageView
        android:id="@+id/forward"
        android:layout_width="75dp"
        android:layout_height="60dp"
        android:layout_marginRight="48dp"
        app:layout_constraintTop_toBottomOf="@+id/container"
        app:layout_constraintLeft_toRightOf="@+id/label"
        app:layout_constraintRight_toRightOf="parent"
        app:srcCompat="@drawable/ic_chevron_right_black_24dp"/>

</androidx.constraintlayout.widget.ConstraintLayout>

在中间获得正方形视图的关键是app:layout_constraintDimensionRatio="1:1"属性。

电话预览:

enter image description here

平板电脑预览:

enter image description here