如何处理与Android XLARGE屏幕？ [英] How to deal with Android XLarge screen?

问题描述

我已经开发了一个时钟控件。看起来很好，在许多设备上。除了摩托罗拉Xoom，因为它在XLARGE类下降。

这是clock.xml

 ＆LT; XML版本=1.0编码=UTF-8＆GT？;
＆LT;的FrameLayout
    的xmlns：机器人=htt​​p://schemas.android.com/apk/res/android
    机器人：后台=＃00000000
    机器人：layout_width =WRAP_CONTENT
    机器人：layout_height =WRAP_CONTENT＆GT;

＆LT; AnalogClock机器人：ID =@ + ID / AnalogClock
    机器人：layout_width =WRAP_CONTENT
    机器人：layout_height =WRAP_CONTENT
    机器人：表盘=@可绘制/ widgetclock
    机器人：hand_hour =@可绘制/ widgethour
    机器人：hand_minute =@可绘制/ widgetminute/＆GT;

    ＆LT;！ - 时间行 - ＆GT;
    ＆LT;的LinearLayout
        机器人：ID =@ + ID / lltimeheaderrow
        机器人：layout_width =WRAP_CONTENT
        机器人：layout_height =WRAP_CONTENT
        机器人：方向=横向
        机器人：layout_gravity =中心|顶
        机器人：layout_marginTop =45dp
        机器人：能见度=水涨船高＆GT;

        ＆所述;！ - 时间 - ＆GT;
        ＆LT;的LinearLayout机器人：ID =@ + ID / llTimeDefault
            机器人：layout_width =WRAP_CONTENT
            机器人：layout_height =WRAP_CONTENT
            机器人：方向=垂直
            机器人：重力=中心＆GT;

            ＆LT;的LinearLayout
                机器人：layout_width =WRAP_CONTENT
                机器人：layout_height =WRAP_CONTENT
                机器人：方向=横向＆GT;

            ＆LT;的TextView
                机器人：ID =@ + ID /小时
                机器人：layout_width =WRAP_CONTENT
                机器人：layout_height =WRAP_CONTENT
                机器人：文字颜色=@色/ my_gray
                机器人：TEXTSTYLE =黑体
                机器人：TEXTSIZE =15sp/＆GT;

            ＆LT;的TextView
                机器人：ID =@ + ID /分钟
                机器人：layout_width =WRAP_CONTENT
                机器人：layout_height =WRAP_CONTENT
                机器人：文字颜色=@色/ my_gray
                机器人：TEXTSTYLE =黑体
                机器人：TEXTSIZE =15sp/＆GT;
            ＆LT; / LinearLayout中＆GT;

            ＆LT;的TextView
                机器人：ID =@ + ID / AM_PM
                机器人：layout_width =WRAP_CONTENT
                机器人：layout_height =WRAP_CONTENT
                机器人：文字颜色=@色/ my_gray
                机器人：TEXTSTYLE =黑体
                机器人：TEXTSIZE =13SP
                机器人：填充=1DP/＆GT;
        ＆LT; / LinearLayout中＆GT;
    ＆LT; / LinearLayout中＆GT;

    ＆LT;！ - 日历图 - ＆GT;
    ＆LT;的LinearLayout
        机器人：ID =@ + ID / llCalGraph
        机器人：layout_width =WRAP_CONTENT
        机器人：layout_height =WRAP_CONTENT
        机器人：方向=垂直
        机器人：layout_gravity =中心|左
        机器人：layout_marginLeft =45dp＆GT;
            ＆LT;的FrameLayout机器人：layout_width =FILL_PARENT
                机器人：layout_height =FILL_PARENT＆GT;
                ＆LT; ImageView的
                    机器人：ID =@ + ID / CalendarImg
                    机器人：SRC =@可绘制/日历
                    机器人：layout_width =WRAP_CONTENT
                    机器人：layout_height =WRAP_CONTENT/＆GT;
                ＆LT; TextView的机器人：ID =@ + ID / DateDayG
                    机器人：layout_width =WRAP_CONTENT
                    机器人：layout_height =WRAP_CONTENT
                    机器人：layout_gravity =中心|顶
                    机器人：layout_marginTop =3DP
                    机器人：TEXTSIZE =11SP
                    机器人：TEXTSTYLE =黑体
                    机器人：文字颜色=@色/ my_gray
                    机器人：则shadowColor =@色/ my_black
                    机器人：shadowDx =1
                    机器人：shadowDy =1
                    机器人：shadowRadius =2
                    ＆GT;＆LT; / TextView的＆GT;
                ＆LT; TextView的机器人：ID =@ + ID / DateNoG
                    机器人：layout_width =WRAP_CONTENT
                    机器人：layout_height =WRAP_CONTENT
                    机器人：layout_gravity =中心
                    机器人：layout_marginTop =5DP
                    机器人：TEXTSIZE =25sp
                    机器人：文字颜色=@色/ my_gray
                    ＆GT;＆LT; / TextView的＆GT;
            ＆LT; /的FrameLayout＆GT;

    ＆LT; / LinearLayout中＆GT;

    ＆LT;！ - 电池 - ＆GT;
    ＆LT;的LinearLayout
        机器人：ID =@ + ID / llBattGraph
        机器人：layout_width =WRAP_CONTENT
        机器人：layout_height =WRAP_CONTENT
        机器人：方向=垂直
        机器人：layout_gravity =中心|右
        机器人：layout_marginRight =45dp＆GT;
            ＆LT;的FrameLayout机器人：layout_width =FILL_PARENT
                机器人：layout_height =FILL_PARENT＆GT;
                ＆LT; ImageView的
                    机器人：ID =@ + ID / BatteryImg
                    机器人：SRC =@可绘制/ batt_00
                    机器人：layout_width =WRAP_CONTENT
                    机器人：layout_height =WRAP_CONTENT/＆GT;
                ＆LT; ImageView的
                    机器人：ID =@ + ID / BatteryFlashing
                    机器人：SRC =@可绘制/闪烁
                    机器人：layout_width =WRAP_CONTENT
                    机器人：layout_height =WRAP_CONTENT
                    机器人：layout_gravity =中心
                    机器人：layout_marginTop =13dp
                    机器人：layout_marginLeft =2DP
                    机器人：能见度=水涨船高/＆GT;
                ＆LT;的TextView
                    机器人：ID =@ + ID / BatteryLevel
                    机器人：layout_width =WRAP_CONTENT
                    机器人：layout_height =WRAP_CONTENT
                    机器人：文字颜色=@色/ my_gray
                    机器人：TEXTSIZE =18sp
                    机器人：layout_gravity =中心/＆GT;


            ＆LT; /的FrameLayout＆GT;
    ＆LT; / LinearLayout中＆GT;

    ＆所述;！ - 天气行 - ＆GT;
    ＆LT;的LinearLayout
        机器人：ID =@ + ID / llweatherrow
        机器人：layout_width =WRAP_CONTENT
        机器人：layout_height =WRAP_CONTENT
        机器人：方向=横向
        机器人：layout_gravity =中心|底
        机器人：layout_marginBottom =45dp＆GT;

        ＆LT;！ - 天气图像 - ＆GT;
        ＆LT;的LinearLayout
            机器人：ID =@ + ID / llWeatherImage
            机器人：layout_width =WRAP_CONTENT
            机器人：layout_height =WRAP_CONTENT
            机器人：能见度=看见
            机器人：layout_gravity =中心＆GT;

            ＆LT; ImageView的机器人：ID =@ + ID / ivWeather
                机器人：layout_width =WRAP_CONTENT
                机器人：layout_height =WRAP_CONTENT
                机器人：背景=@可绘制/ W3200
                /＆GT;
        ＆LT; / LinearLayout中＆GT;

    ＆LT; / LinearLayout中＆GT;

＆LT; /的FrameLayout＆GT;
 

基本上，它具有在widget 4个元素。上，下。左，右部。 我简单地使用的FrameLayout为基地布局，每个元素使用的LinearLayout重力45dp到每个角落。

这是怎样的小部件上看起来的Xoom 我期待的元素的位置应该是在红色圆圈我画。

1. 什么是最好的布局组合，我应该使用？您能否提供？
2. 比方说，我坚持这个布局。我如何为Xoom的设备替代布局？我试图把clock.xml的布局XLARGE和绘制，XLARGE但没有什么...

解决方案

最好的和更合适的方法是创建一个文件夹布局XLARGE ，并在那里包括 clock.xml 当目标设备具有XLARGE布局将被加载。

在这样你可以根据屏幕大小，密度等，得到了来自开发者文档的http://developer.android.com/guide/practices/screens_support.html#DeclaringTabletLayouts

另一种解决方案是让所有的大小是在一定的 45dp 或 XDP 入值的文件夹中一个名为扪，然后文件中声明他们在你的xml为： ... =@扪/ largeButton和与如前所述创建相应的价值观XLARGE以同样的方式，并在其中添加相应的扪文件。

这是非常有用的机制，因为你可以根据屏幕的大小产生不同的布局，使它能够获得每大小不同密度的像素。如果你还没有听说过任何这些条款要求我提供更多的细节。

编辑：从文档

  RES /布局/ my_layout.xml //布局正常屏幕尺寸（默认）

RES /布局小/ my_layout.xml //布局为小屏​​幕尺寸

RES /布局大/ my_layout.xml //布局大屏幕尺寸

RES /布局XLARGE / my_layout.xml //布局，超大的屏幕尺寸

RES /布局XLARGE陆/ my_layout.xml //布局横向特大型
 

您知道到底这样的目录？在相同的文件名，如 clock.xml 的布局随处可见？

另一个编辑评论：

这是更有效，因为在更换只是数字，而不是装载一个完整的布局文件夹中的过渡更加有效，因为你可以猜到。尽管如此，你可以重复使用的尺寸，而不是来回布局中选中那是什么尺寸了吗？就像在一个大按钮修复维度。

和一些更关键的，每个文件夹可扩展的具体原因。如果你想在同一布局，但不同的尺寸，那么你应该重写尺寸不能复制粘贴的整个布局。更有意义，不是吗？

和所付出的努力是pretty的同样的事情。像布局大/ 文件夹中，你将有值-大/ 。有一个在我所提供的文件和在互联网上一个很好的例子。

I have developed a clock widget. Looks fine on many devices. Except Motorola Xoom since it falls under XLARGE category.

This is the clock.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:background="#00000000"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

<AnalogClock android:id="@+id/AnalogClock" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:dial="@drawable/widgetclock" 
    android:hand_hour="@drawable/widgethour" 
    android:hand_minute="@drawable/widgetminute" /> 

    <!-- Time Row -->
    <LinearLayout
        android:id="@+id/lltimeheaderrow"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"        
        android:orientation="horizontal"
        android:layout_gravity="center|top"
        android:layout_marginTop="45dp"
        android:visibility="gone">

        <!-- TIME -->
        <LinearLayout android:id="@+id/llTimeDefault"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:gravity="center">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

            <TextView
                android:id="@+id/HOUR"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@color/my_gray"
                android:textStyle="bold"
                android:textSize="15sp"/>

            <TextView
                android:id="@+id/MINUTE"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@color/my_gray"
                android:textStyle="bold"
                android:textSize="15sp" />
            </LinearLayout>

            <TextView
                android:id="@+id/AM_PM"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@color/my_gray"
                android:textStyle="bold"
                android:textSize="13sp"
                android:padding="1dp" />                        
        </LinearLayout> 
    </LinearLayout>     

    <!-- Calendar Graph -->
    <LinearLayout
        android:id="@+id/llCalGraph"
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_gravity="center|left"    
        android:layout_marginLeft="45dp">   
            <FrameLayout android:layout_width="fill_parent"
                android:layout_height="fill_parent">
                <ImageView
                    android:id="@+id/CalendarImg"
                    android:src="@drawable/calendar"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>                      
                <TextView android:id="@+id/DateDayG"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center|top"
                    android:layout_marginTop="3dp"
                    android:textSize="11sp"
                    android:textStyle="bold"
                    android:textColor="@color/my_gray"
                    android:shadowColor="@color/my_black"
                    android:shadowDx="1"
                    android:shadowDy="1"
                    android:shadowRadius="2"                
                    ></TextView>       
                <TextView android:id="@+id/DateNoG"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="5dp"
                    android:textSize="25sp"
                    android:textColor="@color/my_gray"
                    ></TextView>    
            </FrameLayout>              

    </LinearLayout>             

    <!-- BATTERY -->
    <LinearLayout
        android:id="@+id/llBattGraph"
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content"
        android:orientation="vertical" 
        android:layout_gravity="center|right"
        android:layout_marginRight="45dp">              
            <FrameLayout android:layout_width="fill_parent"
                android:layout_height="fill_parent">
                <ImageView
                    android:id="@+id/BatteryImg"
                    android:src="@drawable/batt_00"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>
                <ImageView
                    android:id="@+id/BatteryFlashing"
                    android:src="@drawable/flashing"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="13dp"
                    android:layout_marginLeft="2dp"
                    android:visibility="gone" />                        
                <TextView
                    android:id="@+id/BatteryLevel"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textColor="@color/my_gray"
                    android:textSize="18sp"
                    android:layout_gravity="center" />


            </FrameLayout>              
    </LinearLayout>                     

    <!-- Weather Row -->
    <LinearLayout
        android:id="@+id/llweatherrow"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"        
        android:orientation="horizontal"
        android:layout_gravity="center|bottom"
        android:layout_marginBottom="45dp"> 

        <!-- WEATHER IMAGE -->
        <LinearLayout
            android:id="@+id/llWeatherImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:visibility="visible"
            android:layout_gravity="center">

            <ImageView android:id="@+id/ivWeather"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/w3200"
                />
        </LinearLayout> 

    </LinearLayout>     

</FrameLayout>

Basically it has 4 elements on the widget. Upper, Bottom. Left and Right Part. I simply use FrameLayout as a base Layout and each element is using LinearLayout with gravity 45dp to each corner.

This is how the widget looks on Xoom I am expecting the elements position should be on the red circle I draw.

1. What is the best Layout combination should I use? Can you suggest?
2. Let's say I'm sticking to this layout. How do I provide alternative layout for Xoom device? I tried to put clock.xml on layout-xlarge and on drawable-xlarge but nothing...

解决方案

The best and neater way is to create a folder layout-xlarge and in there include the clock.xml that will be loaded when the target device has a xlarge layout.

In that way you can make different layouts according to the screen size, density etc. Got from the developer docs http://developer.android.com/guide/practices/screens_support.html#DeclaringTabletLayouts

Another solution is to have all your sizes that are in a certain 45dp or Xdp into the values folder in a file named dimen and then declare them in your xml as: ...="@dimen/largeButton" and with the same way as mentioned before create a corresponding values-xlarge and add the appropriate dimen file in it.

This is very useful mechanisms because you can create different layouts according to the size of the screen and enable it to obtain different density pixels per size. If you haven't heard any of these terms ask me to provide more details.

EDIT: from the docs

res/layout/my_layout.xml             // layout for normal screen size ("default")

res/layout-small/my_layout.xml       // layout for small screen size

res/layout-large/my_layout.xml       // layout for large screen size

res/layout-xlarge/my_layout.xml      // layout for extra large screen size

res/layout-xlarge-land/my_layout.xml // layout for extra large in landscape orientation

Are you sure exactly this kind of directories? With the same filename as the layout like clock.xml everywhere?

ANOTHER EDIT to comment:

It is much more efficient because the transition in replacing just numbers rather than loading a full layout folder is much more efficient as you can guess. Despite that, you can reuse dimensions and not going back and forth among layouts to check "what was that dimension again?" like in a fix dimension of a big button.

And something more critical, each folder can be extended for a specific reason. If you want the same layout but different dimensions then you should override dimensions not copy-paste the whole layout. Makes more sense, doesn't it?

And for the effort is pretty much the same thing. Like layout-large/ folder you will have values-large/. There is a very good example in the documents I have provided and across the internet.

这篇关于如何处理与Android XLARGE屏幕？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！