Android中的响应式设计与外部图像?

时间:2014-09-16 07:17:55

标签: android image layout interface

我正在开发一个带有外部图像形成的界面的Android应用程序。所有图像的大小都以像素为单位导出,当我尝试测试应用程序时,它在所有设备中看起来都不同。

我做得不好?

 <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"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context=".Control">


    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:id="@+id/imageView"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="60dp"
        android:src="@drawable/logo"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn1"
        android:layout_below="@+id/imageView"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginTop="60dp"
        android:layout_marginLeft="15dp"
        android:background="@null"
        android:src="@drawable/btn1state"
        android:clickable="false" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn2"
        android:layout_alignTop="@+id/btn1"
        android:layout_toRightOf="@+id/btn1"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn2state" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn3"
        android:layout_alignTop="@+id/btn2"
        android:layout_toRightOf="@+id/btn2"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn3state" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn4"
        android:layout_alignTop="@+id/btn3"
        android:layout_toRightOf="@+id/btn3"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn4state" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn5"
        android:layout_below="@+id/btn1"
        android:layout_alignLeft="@+id/btn1"
        android:background="@null"
        android:src="@drawable/btn5state"
        android:layout_marginTop="30dp"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn6"
        android:layout_alignTop="@+id/btn5"
        android:layout_toRightOf="@+id/btn5"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn6state" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn7"
        android:layout_alignTop="@+id/btn6"
        android:layout_toRightOf="@+id/btn6"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn7state" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn8"
        android:layout_alignTop="@+id/btn7"
        android:layout_toRightOf="@+id/btn7"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn8state" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn9"
        android:layout_below="@+id/btn5"
        android:layout_alignLeft="@+id/btn5"
        android:background="@null"
        android:src="@drawable/btn9state"
        android:layout_marginTop="30dp"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn10"
        android:layout_alignTop="@+id/btn9"
        android:layout_toRightOf="@+id/btn9"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn10state" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn11"
        android:layout_alignTop="@+id/btn10"
        android:layout_toRightOf="@+id/btn10"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn11state" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn12"
        android:layout_alignTop="@+id/btn11"
        android:layout_toRightOf="@+id/btn11"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn12state"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn13"
        android:layout_below="@+id/btn9"
        android:layout_alignLeft="@+id/btn9"
        android:background="@null"
        android:src="@drawable/btn13state"
        android:layout_marginTop="30dp"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn14"
        android:layout_alignTop="@+id/btn13"
        android:layout_toRightOf="@+id/btn13"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn14state"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn15"
        android:layout_alignTop="@+id/btn14"
        android:layout_toRightOf="@+id/btn14"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn15state"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn16"
        android:layout_alignTop="@+id/btn15"
        android:layout_toRightOf="@+id/btn15"
        android:layout_marginLeft="30dp"
        android:background="@null"
        android:src="@drawable/btn16state"/>

    </RelativeLayout>

这是我的代码示例。

在另一个7&#34;它运行良好,但这款平板电脑有不同的分辨率。

我是否必须使用图像尺寸的dp或我必须做的事情才能适应它?当我将所有图像放在不同的文件夹(drawable-ldpi ...)时,它总是看起来。请问什么?

2 个答案:

答案 0 :(得分:2)

在Android应用上管理图片尺寸的最佳方法,并确保控制图像的行为是使用DensityPixel。

  • px 是一个像素;
  • sp 是与比例无关的像素;
  • dip == dp 是与密度无关的像素。

最好的方法是使用:

  • sp 表示字体大小;
  • 其他一切
  • dp

此外,使用普通的,大的,xlarge不同的RES来管理图像的每种不同分辨率。

您还可以为每个不同尺寸的屏幕定义一个单一布局;让我知道,如果你需要这样做;我可以链接一些有用的东西。

一般知识,来自http://developer.android.com/guide/topics/resources/more-resources.html#Dimension

PX 像素 - 对应于屏幕上的实际像素。

<强>在 英寸 - 基于屏幕的物理尺寸。

<强>毫米 毫米 - 基于屏幕的物理尺寸。

<强> PT 点数 - 基于屏幕物理尺寸的1/72英寸。

<强> DP 密度无关像素 - 一种基于屏幕物理密度的抽象单元。这些单位相对于160 dpi的屏幕,因此一个dp是160 dpi屏幕上的一个像素。 dp与像素的比率将随着屏幕密度而变化,但不一定成正比。注意:编译器同时接受&#34; dip&#34;和&#34; dp&#34;,虽然&#34; dp&#34;更符合&#34; sp&#34;。

<强>属 与比例无关的像素 - 这与dp单位类似,但它也可以根据用户的字体大小首选项进行缩放。建议您在指定字体大小时使用此单位,以便根据屏幕密度和用户的偏好调整它们。

答案 1 :(得分:0)

为了满足不同的屏幕尺寸,我们为各种不同的屏幕尺寸定义了不同的布局文件(即:normal,large,xlarge)。这样,Android可以调整应用程序的大小以适应当前的屏幕大小。

但是我也读过这种布局的方式已被弃用。 Here声明我们应该使用新的配置限定符来定义最小可用定义布局资源所需的最小可用宽度。例如,如果多窗格平板电脑布局需要至少600dp的屏幕宽度,则应将其放置在layout-sw600dp /.

我希望这至少有点帮助。