正常屏幕尺寸的Android布局设计 [英] Android Layout Design for normal screen sizes
问题描述
我是一个hobbiest应用程序开发人员，我觉得我有在Android基础知识，但我在挣扎最主要的一个很好的把握应用设计。我理解如何开发不同的屏幕大小和密度。但是，我在挣扎主要的是每一个正常的和其他尺寸的覆盖这样一个范围内各自类别内的大小。我一直在寻找和搜索，并没有被打包，以找到一个解决方案。
我遇到的主要问题是设计使用eclipse的时候，我做使用的Nexus One在设计中的设计看上去很适合我想要什么，当我换到一个更小的屏幕像3.2 HVGA甚至关系星系这些都是正常的大小的图像，我的图片的位置已经移动。那么什么为Nexus看起来完美的外观上的一些其他正常的屏幕尺寸可怕。
可以做什么，以确保如果图像是直接旁边另一个，它停留在一个不同的屏幕上的方式。我会给当前设计的一个例子我的工作，我希望有人能解释什么即时做错了/我怎样才能得到改善。
Nexus One的设计：
3.2 HVGA：
XML的产生：
＆LT; XML版本=1.0编码=UTF-8＆GT？;
＆LT;的RelativeLayout的xmlns：机器人=http://schemas.android.com/apk/res/android
机器人：ID =@ + ID / RelativeLayout1
机器人：layout_width =match_parent
机器人：layout_height =match_parent
机器人：列数=4
机器人：方向=垂直＆GT; ＆LT;按钮
机器人：ID =@ + ID / Button1的
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_centerHorizontal =真
机器人：layout_centerVertical =真
机器人：背景=@绘制/ I1
机器人：文字=按钮/＆GT; ＆LT;按钮
机器人：ID =@ + ID /按钮1
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_alignParentRight =真
机器人：layout_alignParentTop =真
机器人：背景=@绘制/ I2/＆GT; ＆LT;按钮
机器人：ID =@ + ID /按钮2
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_alignLeft =@ + ID / Button1的
机器人：layout_alignTop =@ + ID / Button1的
机器人：layout_marginLeft =106dp
机器人：layout_marginTop =160dp
机器人：背景=@绘制/ I3/＆GT; ＆LT;按钮
机器人：ID =@ + ID /按钮3
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_alignBaseline =@ + ID /按钮2
机器人：layout_alignBottom =@ + ID /按钮2
机器人：layout_alignRight =@ + ID / Button1的
机器人：layout_marginRight =112dp
机器人：背景=@绘制/ 0-14/＆GT; ＆LT;按钮
机器人：ID =@ + ID /将Button4
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_above =@ + ID /按钮3
机器人：layout_alignLeft =@ + ID /按钮3
机器人：背景=@绘制/ i5的/＆GT;＆LT; / RelativeLayout的＆GT;
尝试添加另一种布局侧键组在一起，然后是居中布局：
＆LT;的RelativeLayout的xmlns：机器人=http://schemas.android.com/apk/res/android
机器人：ID =@ + ID / RelativeLayout1
机器人：layout_width =match_parent
机器人：layout_height =match_parent
机器人：列数=4
机器人：方向=垂直
机器人：layout_alignParentTop =真
机器人：layout_alignParentLeft =真
机器人：layout_alignParentStart =真正的＆GT; ＆LT;按钮
机器人：ID =@ + ID / Button1的
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_centerHorizontal =真
机器人：layout_centerVertical =真
机器人：背景=@绘制/ I1
机器人：文字=按钮/＆GT; ＆LT;的RelativeLayout的xmlns：机器人=http://schemas.android.com/apk/res/android
机器人：ID =@ + ID / RelativeLayout2
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_centerInParent =真正的＆GT; ＆LT;按钮
机器人：ID =@ + ID /按钮1
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：layout_alignParentRight =假
机器人：layout_alignParentTop =真
机器人：背景=@绘制/ I2
机器人：layout_alignParentLeft =真/＆GT; ＆LT;按钮
机器人：ID =@ + ID /按钮2
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：背景=@绘制/ I3
机器人：layout_below =@ + ID /按钮1
机器人：layout_alignParentLeft =真/＆GT; ＆LT;按钮
机器人：ID =@ + ID /按钮3
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：背景=@绘制/ 0-14
机器人：layout_below =@ + ID /将Button4
机器人：layout_toRightOf =@ + ID /按钮2/＆GT; ＆LT;按钮
机器人：ID =@ + ID /将Button4
机器人：layout_width =WRAP_CONTENT
机器人：layout_height =WRAP_CONTENT
机器人：背景=@绘制/ I5
机器人：layout_toRightOf =@ + ID /按钮2
机器人：layout_alignParentTop =真/＆GT;
＆LT; / RelativeLayout的＆GT;
＆LT; / RelativeLayout的＆GT;
I am a hobbiest app developer and I feel I have a good grasp on android basics but the main thing that I struggle at is app design. I understand how to develop for different screen sizes and densities. But the main thing I struggle at is each of the normal and other sizes cover such a range of sizes within their respective categories. I have been searching and searching and not been bale to find a solution.
The main issue I am having is when designing using eclipse, i make a design using nexus one at the design looks perfect for what I want when I swap to a smaller screen like 3.2 HVGA or even the nexus galaxy which are all normal sized images, the location of my images have moved. So what looked perfect for the nexus one looks awful on some other normal screen sizes.
What can be done to ensure if an image is directly next to another that it stays that way on a different screens. I will give an example of the current design I am working on and I hope somebody can explain what im doing wrong/how i can improve.
Nexus One Design:
3.2 HVGA:
the xml generated:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="4"
android:orientation="vertical" >
<Button
android:id="@+id/Button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="@drawable/i1"
android:text="Button" />
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="@drawable/i2" />
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@+id/Button1"
android:layout_alignTop="@+id/Button1"
android:layout_marginLeft="106dp"
android:layout_marginTop="160dp"
android:background="@drawable/i3" />
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="@+id/button2"
android:layout_alignBottom="@+id/button2"
android:layout_alignRight="@+id/Button1"
android:layout_marginRight="112dp"
android:background="@drawable/i4" />
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/button3"
android:layout_alignLeft="@+id/button3"
android:background="@drawable/i5" />
</RelativeLayout>
Try adding another layout for side buttons to group them together, and then center that layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="4"
android:orientation="vertical"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<Button
android:id="@+id/Button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="@drawable/i1"
android:text="Button" />
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/RelativeLayout2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="false"
android:layout_alignParentTop="true"
android:background="@drawable/i2"
android:layout_alignParentLeft="true"/>
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/i3"
android:layout_below="@+id/button1"
android:layout_alignParentLeft="true"/>
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/i4"
android:layout_below="@+id/button4"
android:layout_toRightOf="@+id/button2"/>
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/i5"
android:layout_toRightOf="@+id/button2"
android:layout_alignParentTop="true"/>
</RelativeLayout>
</RelativeLayout>
这篇关于正常屏幕尺寸的Android布局设计的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
