2014-01-14 51 views
0

我有以下布局。我在ldpi,mdpi,hdpi和xhdpi适当的文件夹中有图像。我不明白为什么布局不能缩放到合适的尺寸。我添加了ScrollView,所以至少可以滚动查看整个布局,但这不是预期的效果。我希望所有内容在不滚动的情况下以各种尺寸和密度显示。我已阅读了支持多种尺寸和密度的Android文档,但我不明白该从哪里下载。我正在使用“adb shell am display-density”和“adb shell am display-size”命令来模拟Nexus 10上的不同设备。Android布局多屏幕尺寸和密度

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="fill_parent" 
android:layout_height="fill_parent"> 

<RelativeLayout 
android:layout_width="fill_parent" 
android:layout_height="wrap_content" 
android:background="@drawable/bg" > 

<View 
    android:id="@+id/viewSpacer0" 
    android:layout_width="1dp" 
    android:layout_height="7dip" 
    android:layout_centerHorizontal="true" /> 

<LinearLayout 
    android:id="@+id/linearLayoutLine1" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerHorizontal="true" 
    android:orientation="horizontal" 
    android:layout_below="@+id/viewSpacer0" > 

<ImageView 
    android:id="@+id/imageLogo" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:scaleType="fitCenter" 
    android:src="@drawable/logo_large" /> 

<View 
    android:id="@+id/viewSpacer1" 
    android:layout_width="20dp" 
    android:layout_height="1dip" /> 

<ImageView 
    android:id="@+id/imageView50Best" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:adjustViewBounds="true" 
    android:src="@drawable/fifty_best_logo" /> 

</LinearLayout> 

<View 
    android:id="@+id/viewSpacer2" 
    android:layout_width="1dp" 
    android:layout_height="10dip" 
    android:layout_below="@+id/linearLayoutLine1" 
    android:layout_centerHorizontal="true" /> 

<TableLayout 
    android:id="@+id/tableLayoutHeader" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/viewSpacer2" 
    android:layout_centerHorizontal="true" 
    android:background="@color/transparent" > 

<TableRow 
    android:id="@+id/tableRowPhoneNumberLabels" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<TextView 
    android:id="@+id/textViewHospital" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="Hospital" 
    android:textSize="20sp" 
    android:textColor="@color/white" /> 

<View 
    android:id="@+id/viewSpacerBetweenLabels" 
    android:layout_width="15dp" 
    android:layout_height="1dip" 
    android:layout_below="@+id/tableLayoutHeader" 
    android:layout_centerHorizontal="true" /> 

<TextView 
    android:id="@+id/textViewEmergencyRoom" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="Emergency Room" 
    android:textSize="20sp" 
    android:textColor="@color/white" /> 

</TableRow> 

<TableRow 
    android:id="@+id/tableRowPhoneNumbers" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<TextView 
    android:id="@+id/textViewHospitalSwitchboard" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="(xxx) xxx-xxxx" 
    android:textSize="20sp" 
    android:textColor="@color/white" /> 

<View 
    android:id="@+id/viewSpacerBetweenPhoneNumbers" 
    android:layout_width="15dp" 
    android:layout_height="1dip" 
    android:layout_below="@+id/tableLayoutHeader" 
    android:layout_centerHorizontal="true" /> 

<TextView 
    android:id="@+id/textViewEmergencyPhone" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="(xxx) xxx-xxxx" 
    android:textSize="20sp" 
    android:textColor="@color/white" /> 

</TableRow> 

</TableLayout> 

<View 
    android:id="@+id/viewSpacer3" 
    android:layout_width="1dp" 
    android:layout_height="15dip" 
    android:layout_below="@+id/tableLayoutHeader" 
    android:layout_centerHorizontal="true" /> 

<TableLayout 
    android:id="@+id/tableLayoutMenu" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/viewSpacer3" 
    android:layout_centerHorizontal="true" 
    android:background="@color/transparent" > 

<TableRow 
    android:id="@+id/tableRow1" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<ImageButton 
    android:id="@+id/imageDrSearch" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:src="@drawable/icon_dr_search" /> 

<ImageButton 
    android:id="@+id/imageLocations" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:src="@drawable/icon_locations" /> 

</TableRow> 

<TableRow 
    android:id="@+id/tableRow2" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<ImageButton 
    android:id="@+id/imageSendCard" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:src="@drawable/icon_send_card" /> 

<ImageButton 
    android:id="@+id/imageServices" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:src="@drawable/icon_services" /> 

</TableRow> 

<TableRow 
    android:id="@+id/tableRow3" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<ImageButton 
    android:id="@+id/ImageHealthEncyclopedia" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:src="@drawable/icon_health_encyclopedia" /> 

<ImageButton 
    android:id="@+id/imageClassesEvents" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:src="@drawable/icon_events_classes" /> 

</TableRow> 

<TableRow 
    android:id="@+id/tableRow4" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<ImageButton 
    android:id="@+id/imageCareers" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:src="@drawable/icon_careers" /> 

<ImageButton 
    android:id="@+id/imageNewsroom" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:src="@drawable/icon_newsroom" /> 

</TableRow> 

</TableLayout> 

<View 
    android:id="@+id/viewSpacer4" 
    android:layout_width="1dp" 
    android:layout_height="5dip" 
    android:layout_below="@+id/tableLayoutMenu" 
    android:layout_centerHorizontal="true" /> 

<LinearLayout 
    android:id="@+id/linearLayoutLine3" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerHorizontal="true" 
    android:layout_below="@+id/viewSpacer4" 
    android:background="@color/lightgrey" > 

<ImageButton 
    android:id="@+id/imageViewWebsite" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_medium" 
    android:src="@drawable/www_small" /> 

<ImageButton 
    android:id="@+id/imageViewFacebook" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_medium" 
    android:src="@drawable/facebook_small" /> 

<ImageButton 
    android:id="@+id/imageViewTwitter" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_medium" 
    android:src="@drawable/twitter_small" /> 

</LinearLayout> 

</RelativeLayout> 

</ScrollView> 

后高兴的建议更新时间:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:background="@drawable/bg" > 

<View 
    android:id="@+id/viewSpacer0" 
    android:layout_width="1dp" 
    android:layout_height="7dip" 
    android:layout_centerHorizontal="true" /> 

<LinearLayout 
    android:id="@+id/linearLayoutLine1" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerHorizontal="true" 
    android:orientation="horizontal" 
    android:layout_below="@+id/viewSpacer0" > 

<ImageView 
    android:id="@+id/imageLogo" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_weight="2" 
    android:scaleType="center" 
    android:src="@drawable/logo_large" /> 

<View 
    android:id="@+id/viewSpacer1" 
    android:layout_weight="1" 
    android:layout_width="20dp" 
    android:layout_height="1dip" /> 

<ImageView 
    android:id="@+id/imageView50Best" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_weight="2" 
    android:adjustViewBounds="true" 
    android:src="@drawable/fifty_best_logo" /> 

</LinearLayout> 

<TableLayout 
    android:id="@+id/tableLayoutHeader" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/linearLayoutLine1" 
    android:layout_centerHorizontal="true" 
    android:background="@color/transparent" > 

<TableRow 
    android:id="@+id/tableRowPhoneNumberLabels" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<TextView 
    android:id="@+id/textViewHospital" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="Hospital" 
    android:layout_weight="2" 
    android:textSize="20sp" 
    android:textColor="@color/white" /> 

<View 
    android:id="@+id/viewSpacerBetweenLabels" 
    android:layout_width="15dp" 
    android:layout_height="1dip" 
    android:layout_weight="1" 
    android:layout_below="@+id/tableLayoutHeader" /> 

<TextView 
    android:id="@+id/textViewEmergencyRoom" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="Emergency Room" 
    android:layout_weight="2" 
    android:textSize="20sp" 
    android:textColor="@color/white" /> 

</TableRow> 

<TableRow 
    android:id="@+id/tableRowPhoneNumbers" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<TextView 
    android:id="@+id/textViewHospitalSwitchboard" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="(xxx) xxx-xxxx" 
    android:textSize="20sp" 
    android:layout_weight="2" 
    android:textColor="@color/white" /> 

<View 
    android:id="@+id/viewSpacerBetweenPhoneNumbers" 
    android:layout_width="15dp" 
    android:layout_height="1dip" 
    android:layout_below="@+id/tableLayoutHeader" 
    android:layout_weight="1" 
    android:layout_centerHorizontal="true" /> 

<TextView 
    android:id="@+id/textViewEmergencyPhone" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="(xxx) xxx-xxxx" 
    android:textSize="20sp" 
    android:layout_weight="2" 
    android:textColor="@color/white" /> 

</TableRow> 

</TableLayout> 

<View 
    android:id="@+id/viewSpacer3" 
    android:layout_width="1dp" 
    android:layout_height="15dip" 
    android:layout_below="@+id/tableLayoutHeader" 
    android:layout_centerHorizontal="true" /> 

<TableLayout 
    android:id="@+id/tableLayoutMenu" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/viewSpacer3" 
    android:layout_centerHorizontal="true" 
    android:background="@color/transparent" > 

<TableRow 
    android:id="@+id/tableRow1" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<ImageButton 
    android:id="@+id/imageDrSearch" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:scaleType="center" 
    android:layout_weight="1" 
    android:src="@drawable/icon_dr_search" /> 

<ImageButton 
    android:id="@+id/imageLocations" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:scaleType="center" 
    android:layout_weight="1" 
    android:src="@drawable/icon_locations" /> 

</TableRow> 

<TableRow 
    android:id="@+id/tableRow2" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<ImageButton 
    android:id="@+id/imageSendCard" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:scaleType="center" 
    android:layout_weight="1" 
    android:src="@drawable/icon_send_card" /> 

<ImageButton 
    android:id="@+id/imageServices" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:scaleType="center" 
    android:layout_weight="1" 
    android:src="@drawable/icon_services" /> 

</TableRow> 

<TableRow 
    android:id="@+id/tableRow3" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<ImageButton 
    android:id="@+id/ImageHealthEncyclopedia" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:scaleType="center" 
    android:layout_weight="1" 
    android:src="@drawable/icon_health_encyclopedia" /> 

<ImageButton 
    android:id="@+id/imageClassesEvents" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:scaleType="center" 
    android:layout_weight="1" 
    android:src="@drawable/icon_events_classes" /> 

</TableRow> 

<TableRow 
    android:id="@+id/tableRow4" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center" > 

<ImageButton 
    android:id="@+id/imageCareers" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:scaleType="center" 
    android:layout_weight="1" 
    android:src="@drawable/icon_careers" /> 

<ImageButton 
    android:id="@+id/imageNewsroom" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_xsmall" 
    android:scaleType="center" 
    android:layout_weight="1" 
    android:src="@drawable/icon_newsroom" /> 

</TableRow> 

</TableLayout> 

<View 
    android:id="@+id/viewSpacer4" 
    android:layout_width="1dp" 
    android:layout_height="5dip" 
    android:layout_below="@+id/tableLayoutMenu" 
    android:layout_centerHorizontal="true" /> 

<LinearLayout 
    android:id="@+id/linearLayoutLine3" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerHorizontal="true" 
    android:layout_below="@+id/viewSpacer4" 
    android:background="@color/lightgrey" > 

<ImageButton 
    android:id="@+id/imageViewWebsite" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_medium" 
    android:layout_weight="5" 
    android:src="@drawable/www_small" /> 

<ImageButton 
    android:id="@+id/imageViewFacebook" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_medium" 
    android:layout_weight="5" 
    android:src="@drawable/facebook_small" /> 

<ImageButton 
    android:id="@+id/imageViewTwitter" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@color/transparent" 
    android:padding="@dimen/padding_medium" 
    android:layout_weight="5" 
    android:src="@drawable/twitter_small" /> 

</LinearLayout> 

+0

也许你的资源/ drawable-xxx的img没有正确缩放:/,我也发现这是我的一个项目中的一个问题,今天我正在测试这个photoshop插件(http://www.cutandslice。我/)来帮助我解决资源大小问题 – GhostDerfel

+0

您可能还想检查是否在运行时返回了正确的屏幕大小和DPI值,以防您的adb命令被忽略。 – TheIT

+0

@TheIT - 感谢您的评论。我该怎么做呢?我运行adb命令后屏幕大小发生了变化。 –

回答

1

不同的资源,在* DPI文件夹只占屏幕密度,而不是屏幕尺寸。您的图片资源仍然会有一些固有尺寸:根据屏幕尺寸的不同,它们可能太大或太小,无法满足您希望它们适合的空间。有一些选项可以根据屏幕大小(小,普通,大,xlarge)提供资源,但这些文件夹仅将屏幕分为多个存储桶。每个存储桶仍然有不同的屏幕尺寸,它们将会更接近。因此,不可能为每个屏幕提供恰当的资源大小。相反,你需要告诉你的布局适当地扩展事物。例如,现在,通过android:layout_height="wrap_content",,您告诉您的最高级别的RelativeLayout,即使它在屏幕外延伸,您也希望它达到所需的时间。相反,您应该删除滚动视图并使用android:layout_height="match_parent"将其固定到屏幕大小。在LinearLayouts的内部,使用android:layout_weight来定义哪些对象占用了空白空间。在ImageViews上,使用android:scaleType来定义图像的缩放比例。

+0

非常感谢您的建议。我一直在玩布局。查看上面的帖子了解我的更改。它有所改善,但我还很遥远。还有其他建议吗? –

+0

它有什么问题?您可能希望将相对布局更改为线性布局,并为其所有子项使用权重。对于一些小屏幕,你也可能只是有太多的东西。 – GLee

+0

小屏幕和普通屏幕(在http://developer.android.com/guide/practices/screens_support.html中定义为“表3”)的底部和侧面被截断。底部在一些大屏幕尺寸上被切断。如何让布局在所有尺寸上完全可见? –