迎合各种Android屏幕尺寸或开发通用屏幕布局?

时间:2013-09-20 10:15:06

标签: android

我正在开发一个应用程序,我必须迎合4英寸到10英寸之间的大多数Android设备,并且想知道是否有办法创建可以根据设备进行扩展的通用屏幕布局。

这是一种更好的方式,而不是我目前为每种屏幕类别开发不同布局和相应活动的逻辑,即4英寸,5英寸等。

如下所示,我利用DisplayMetrics字段和毕达哥拉斯定理来确定屏幕尺寸,例如找到设备的高度我进行以下计算:

double yDeviceScreenSize = Math.pow(DeviceScreenSize.heightPixels/DeviceScreenSize.ydpi,2);

上面的代码行基本上是显示器的绝对高度(以像素为单位)除以Y维度中每英寸屏幕的精确物理像素,然后是平方值。

以类似的方式,我以相同的方式获得宽度图。这表示如下:

double xDeviceScreenSize = Math.pow(DeviceScreenSize.widthPixels/DeviceScreenSize.xdpi,2);

上面的计算之后是获得如下所示的平方根值,然后我用它来挑选我在相同屏幕尺寸值的设备上开发和测试的值:

DeviceScreenSizeInInchesToDisplayLogInScreen = Math.sqrt(xDeviceScreenSize + yDeviceScreenSize);

如下所示,使用

<supports-screens android:smallScreens="true" 
  android:normalScreens="true" 
  android:largeScreens="true"
  android:xlargeScreens="true"
  android:anyDensity="true"/>

下面是我在启动启动画面时调用的代码屏幕确定方法:

   // Splash screen delay
public final void SplashScreenThread() {

    //  For tracking purposes record in logcat SplashScreenThread() method has been called
    Log.i(TAG + "onCreate()", "SplashScreenThread(); HAS STARTED");

    // Thread for the display of the SplashScreen
    SightsandSoundsSplashThread = new Thread() {
        @Override
        public void run() {

            try {
                int waited = 0;
                while(active && (waited < SplashTime)) {
                    sleep(100);
                    if(active) {
                        waited += 100;
                    }
                }
            } catch(InterruptedException e) {

                // do nothing
                Log.e(TAG + "SplashScreenThread()", "SplashScreenThread() ERROR IS AS FOLLOWS: " + e.toString());
            } finally {
                    // Call method finish to kill any 
                    finish();

                    // Fetch the screen size in order to call correct layout wrt the next screen - firstly create and object of type DisplayMetrics
                    DisplayMetrics DeviceScreenSize = new DisplayMetrics();

                    // Secondly fetch the window manager using method chaining
                    getWindowManager().getDefaultDisplay().getMetrics(DeviceScreenSize);

                    // Calculate the width of the screen in inches
                    double xDeviceScreenSize = Math.pow(DeviceScreenSize.widthPixels/DeviceScreenSize.xdpi,2);

                    // Record in logcat DeviceScreenSize.xdpi
                    Log.d(TAG,"DeviceScreenSize.widthPixels is: " + DeviceScreenSize.widthPixels + " and DeviceScreenSize.xdpi is: " + DeviceScreenSize.xdpi);
                    Log.d(TAG,"DeviceScreenSize.heightPixels is: " + DeviceScreenSize.heightPixels + " and DeviceScreenSize.ydpi is: " + DeviceScreenSize.ydpi);

                    // Calculate the height of the screen in inches
                    double yDeviceScreenSize = Math.pow(DeviceScreenSize.heightPixels/DeviceScreenSize.ydpi,2);

                    // Obtain screen size using pythagoras theorem
                    DeviceScreenSizeInInchesToDisplayLogInScreen = Math.sqrt(xDeviceScreenSize + yDeviceScreenSize);

                    // Record in logcat screen size in inches
                    Log.e(TAG,"DeviceScreenSize.widthPixels is: " + DeviceScreenSize.widthPixels + "\nDeviceScreenSize.heightPixels is: " + DeviceScreenSize.heightPixels + "\nScreen inches : " + DeviceScreenSizeInInchesToDisplayLogInScreen);

                    // Identify device screen size based on calculation of screen size
                    if (DeviceScreenSizeInInchesToDisplayLogInScreen < 2.9) {
                           Log.e(TAG,"< 2.9 inch range called");

                           Intent ScreenNotSupportedScreen = new Intent(SplashScreenFour.this, UnderDevltScn18inches.class);
                           startActivity(ScreenNotSupportedScreen);

                           Log.e(TAG,"DEVICE NOT ACCOMODATED - DEVICE DETERMINED TO BE LESS THAN 2.9 INCHES - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);
                    }  else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 2.9) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 3.6)) {
                           Log.e(TAG,"2.9 to 3.6 inch range called");

                           Intent ScreenNotSupportedScreen = new Intent(SplashScreenFour.this, UnderDevltScn29inches.class);
                           startActivity(ScreenNotSupportedScreen);     

                           Log.e(TAG,"DEVICE NOT ACCOMODATED - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);                               
                    }  else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 3.6) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 3.8)) {
                           Log.e(TAG,"3.6 to 3.8 inch range called");

                           Intent ScreenNotSupportedScreen = new Intent(SplashScreenFour.this, UnderDevltScn29inches.class);
                           startActivity(ScreenNotSupportedScreen); 

                           Log.e(TAG,"DEVICE NOT ACCOMODATED - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);
                    }  else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 3.8) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 4.0)) {
                           Log.e(TAG,"3.8 to 4.0 inch range called"); 

                           Intent loginscreen = new Intent(SplashScreenFour.this, LogInScreen38inches.class);
                           startActivity(loginscreen);
                    }  else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 4.0) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 4.28)) {
                           Log.e(TAG,"4.0 to 4.28 inch range called");

                           Intent loginscreen = new Intent(SplashScreenFour.this, LogInScreen4inches.class);
                           startActivity(loginscreen);

                           Log.e(TAG,"DEVICE NOT ACCOMODATED - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);
                    } else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 4.28) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 4.8)) {
                           Log.e(TAG,"4.28 to 4.3 inch range called");

                           Intent loginscreen = new Intent(SplashScreenFour.this, LogInScreen428inches.class);
                           startActivity(loginscreen);

                           Log.e(TAG,"DEVICE NOT ACCOMODATED - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);
                    } else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 4.8) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 4.9)) {
                           Log.e(TAG,"4.8 to 4.9 inch range called");

                           Intent loginscreen = new Intent(SplashScreenFour.this, LogInScreen465inches.class);
                           startActivity(loginscreen);

                           Log.e(TAG,"DEVICE NOT ACCOMODATED - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);
                    }  else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 4.9) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 5.5)) {
                           Log.e(TAG,"4.9 to 5.5 inch range called");

                           Intent ScreenNotSupportedScreen = new Intent(SplashScreenFour.this, LogInScreen498inches.class);
                           startActivity(ScreenNotSupportedScreen);

                           Log.e(TAG,"DEVICE NOT ACCOMODATED - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);


                    } else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 5.5) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 5.9)) {
                            Log.e(TAG,"5.5 to 5.9 inch range called");

                            Intent loginscreen = new Intent(SplashScreenFour.this, LogInScreen57inches.class);
                            startActivity(loginscreen);

                            Log.e(TAG,"DEVICE NOT ACCOMODATED - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);
                    } else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 5.9) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 6.8)) {
                            Log.e(TAG,"5.9 to 6.9 inch range called");

                            Intent loginscreen = new Intent(SplashScreenFour.this, LogInScreen59inches.class);
                            startActivity(loginscreen);

                       Log.e(TAG,"DEVICE NOT ACCOMODATED - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);
                    } else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 6.8) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 7.0)) {
                           Log.e(TAG,"6.0 to 7.0 inch range called");

                           Intent ScreenNotSupportedScreen = new Intent(SplashScreenFour.this, LogInScreen699inches.class);
                           startActivity(ScreenNotSupportedScreen);

                           Log.e(TAG,"DEVICE NOT ACCOMODATED - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);
                    }  else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 7.0) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 8.0)) {
                           Log.e(TAG,"7.0 to 8.0 inch range called");

                           Intent loginscreen = new Intent(SplashScreenFour.this, LogInScreen.class);
                           startActivity(loginscreen);

                    }  else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 8.0) && (DeviceScreenSizeInInchesToDisplayLogInScreen < 9.0)) {
                           Log.e(TAG,"8.0 to 9.0 inch range called");

                           Intent ScreenNotSupportedScreen = new Intent(SplashScreenFour.this, UnderDevltScnFinish.class);
                           startActivity(ScreenNotSupportedScreen);

                           Log.e(TAG,"DEVICE NOT ACCOMODATED - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);
                    } else if ((DeviceScreenSizeInInchesToDisplayLogInScreen >= 9.0) && (DeviceScreenSizeInInchesToDisplayLogInScreen <= 10.2)) {
                           Log.e(TAG,"> 9.0 to 10.2 inch range called");

                           Intent loginscreen = new Intent(SplashScreenFour.this, LogInScreen10inches.class);
                           startActivity(loginscreen);

                           Log.e(TAG,"DEVICE NOT ACCOMODATED - ACTUAL DEVICE SIZE IS: " + DeviceScreenSizeInInchesToDisplayLogInScreen);
                    }
            }
        }
    };

    SightsandSoundsSplashThread.start();
}

以下是我的清单,表明我的位置

    <?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="bge.applcs.dsa"
    android:versionCode="7"
    android:versionName="1.07">

    <uses-sdk
        android:minSdkVersion="8"
        android:maxSdkVersion="18"
        android:targetSdkVersion="8"/>


    <supports-screens android:smallScreens="true" 
          android:normalScreens="true" 
          android:largeScreens="true"
          android:xlargeScreens="true"
          android:anyDensity="true"/>

    <application
        android:icon="@drawable/iclauncher96"
        android:label="@string/appname"
        android:theme="@android:style/Theme.NoTitleBar.Fullscreen">

        <uses-library android:name="android.test.runner" />   

        <!-- Splash screen -->
        <activity   
            android:name="com.applcs.SplashScreenFour"
            android:screenOrientation="landscape">
            <intent-filter> 
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

以下是我创建的布局示例。

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/llbgedsafinccalclayout7inches"
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    android:background="@drawable/imgplainbackground"
    android:orientation="horizontal">

   <RelativeLayout 
        android:id="@+id/rlbgedsafinccalclayout7inches"
        android:layout_width="925dp"
        android:layout_height="300dp"
        android:layout_marginTop="100dp"
        android:layout_marginLeft="45dp"
        android:background="@drawable/imgbgedsafinccalcmainbitbgnd2">

     <!-- <TextView
        android:id="@+id/tvcurrencysign"
        android:layout_width="wrap_content"
        android:layout_height="31dp"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="330dp"
        android:paddingTop="4dp"
        android:textSize="18sp"
        android:textColor="#FFD700"
        android:background="#07000000"/> -->        

    <EditText
        android:id="@+id/ettotalvalue7inches"
        android:singleLine="true"
        android:layout_width="215dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="14dp"
        android:layout_marginLeft="389dp"
        android:maxLength="9"
        android:layout_gravity="center_vertical|right"
        android:background="#07000000"
        android:textColor="#FFD700"
        android:textSize="19sp"
        android:ems="10"
        android:inputType="numberDecimal|numberSigned"
        android:digits="0123456789."
        android:selectAllOnFocus="true"/>

     <ImageButton
        android:id="@+id/btngenerate7inches"
        android:layout_width="276dp"
        android:layout_height="54dp"
        android:layout_marginLeft="45dp"
        android:layout_toRightOf="@+id/ettotalvalue7inches"
        android:background="@drawable/btngeneratebgnd"/>    

     <ImageButton
        android:id="@+id/btntwoyears7inches"
        android:layout_width="73dp"
        android:layout_height="47dp"
        android:layout_marginTop="56dp"
        android:layout_marginLeft="5dp"
        android:layout_below="@+id/ettotalvalue7inches"
        android:background="@drawable/btntwoyears"/>    

     <ImageButton
        android:id="@+id/btntthreeyears7inches"
        android:layout_width="73dp"
        android:layout_height="47dp"
        android:layout_marginTop="56dp"
        android:layout_marginLeft="2dp"
        android:layout_below="@+id/ettotalvalue7inches"
        android:layout_toRightOf="@+id/btntwoyears7inches"
        android:background="@drawable/btnthreeyears"/>  

     <ImageButton
        android:id="@+id/btnfouryears7inches"
        android:layout_width="73dp"
        android:layout_height="47dp"
        android:layout_marginTop="56dp"
        android:layout_marginLeft="1dp"
        android:layout_below="@+id/ettotalvalue7inches"
        android:layout_toRightOf="@+id/btntthreeyears7inches"
        android:background="@drawable/btnfouryears"/>   

     <ImageButton
        android:id="@+id/btnfiveyears7inches"
        android:layout_width="74dp"
        android:layout_height="47dp"
        android:layout_marginTop="56dp"
        android:layout_marginLeft="1dp"
        android:layout_below="@+id/ettotalvalue7inches"
        android:layout_toRightOf="@+id/btnfouryears7inches"
        android:background="@drawable/btnfiveyears"/>

     <TextView
        android:id="@+id/tvweeklypayment"
        android:layout_width="122dp"
        android:layout_height="25dp"
        android:layout_marginTop="22dp"
        android:layout_marginLeft="310dp"
        android:layout_below="@+id/btntwoyears7inches"
        android:paddingTop="6dp"
        android:paddingLeft="0dp"
        android:textSize="12sp"
        android:textColor="#FFD700"
        android:background="#07000000"/>         

     <TextView
        android:id="@+id/tvfirstpayment"
        android:layout_width="122dp"
        android:layout_height="25dp"
        android:layout_marginTop="21dp"
        android:layout_marginLeft="310dp"
        android:layout_below="@+id/tvweeklypayment"
        android:paddingTop="6dp"
        android:paddingLeft="0dp"
        android:textSize="12sp"
        android:textColor="#FFD700"
        android:background="#07000000"/>

     <TextView
        android:id="@+id/tvmonthlypayment"
        android:layout_width="122dp"
        android:layout_height="25dp"
        android:layout_marginTop="22dp"
        android:layout_marginLeft="310dp"
        android:layout_below="@+id/tvfirstpayment"
        android:paddingTop="6dp"
        android:paddingLeft="0dp"
        android:textSize="12sp"
        android:textColor="#FFD700"
        android:background="#07000000"/>        

    <TextView
        android:id="@+id/tvtotalcostpayment"
        android:layout_width="122dp"
        android:layout_height="25dp"
        android:layout_marginTop="22dp"
        android:layout_marginLeft="351dp"
        android:layout_below="@+id/btnfiveyears7inches"
        android:layout_toRightOf="@+id/tvweeklypayment"
        android:paddingTop="6dp"
        android:paddingLeft="0dp"
        android:textSize="12sp"
        android:textColor="#FFD700"
        android:background="#07000000"/>        

     <TextView
        android:id="@+id/tvtaxreliefpayment"
        android:layout_width="122dp"
        android:layout_height="25dp"
        android:layout_marginTop="22dp"
        android:layout_marginLeft="351dp"
        android:layout_below="@+id/tvtotalcostpayment"
        android:layout_toRightOf="@+id/tvfirstpayment"
        android:paddingTop="6dp"
        android:paddingLeft="0dp"
        android:textSize="12sp"
        android:textColor="#FFD700"
        android:background="#07000000"/>        

     <TextView
        android:id="@+id/tvnetcostpayment"
        android:layout_width="122dp"
        android:layout_height="25dp"
        android:layout_marginTop="21dp"
        android:layout_marginLeft="351dp"
        android:layout_below="@+id/tvtaxreliefpayment"
        android:layout_toRightOf="@+id/tvmonthlypayment"
        android:paddingTop="4dp"
        android:paddingLeft="0dp"
        android:textSize="12sp"
        android:textColor="#FFD700"
        android:background="#07000000"/>       

     <TextView
        android:id="@+id/tvnumbofmonthlypayments"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="19dp"
        android:layout_below="@+id/tvtaxreliefpayment"
        android:layout_marginLeft="15dp"
        android:textSize="19sp"
        android:text="24"
        android:textColor="#FFD700"
        android:background="#07000000"/>         

    </RelativeLayout>   

    <RelativeLayout 
        android:id="@+id/rlnotes7inches"
        android:layout_width="925dp"
        android:layout_height="300dp"
        android:layout_marginTop="100dp"
        android:layout_marginLeft="45dp"
        android:background="@drawable/imgnotesbgnd"> 

    </RelativeLayout>

    <TextView
        android:id="@+id/tvinvalidentry7inches"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:layout_marginLeft="370dp"
        android:layout_below="@+id/rlbgedsafinccalclayout7inches"
        android:textSize="25sp"
        android:textColor="#FF0000"
        android:background="#07000000"/>  

    <ImageButton
        android:id="@+id/btninfo7inches"
        android:layout_width="65dp"
        android:layout_height="60dp"
        android:layout_marginTop="82dp"
        android:layout_marginLeft="12dp"
        android:layout_below="@+id/rlbgedsafinccalclayout7inches"
        android:background="@drawable/btninfobgnd"/>    

     <TextView
         android:id="@+id/tvdateandtime7inches"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="95dp"
         android:layout_marginLeft="515dp"
         android:layout_below="@+id/rlbgedsafinccalclayout7inches"
         android:layout_toRightOf="@+id/btninfo7inches"
         android:background="#07000000"
         android:textColor="#FFFFFF"
         android:textSize="25sp"
         android:textStyle="bold" />

     <DigitalClock
        android:id="@+id/digitalclock7inches"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="95dp"
        android:background="#07000000"
        android:layout_below="@+id/rlbgedsafinccalclayout7inches"
        android:layout_toRightOf="@+id/tvdateandtime7inches"
        android:textColor="#FFFFFF"
        android:textSize="25sp"
        android:textStyle="bold"/>  

</RelativeLayout>

感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

您是否阅读过Supporting Multiple Screens?有很多关于如何处理不同屏幕尺寸的信息。

通常,这只是创建多个布局的情况。具体数量取决于您希望布局在设备之间的差异。

这些布局放置在res/layout-*/文件夹中,例如res/layout-xhdpi/res/layout-land/res/layout-land-sw800dp/(有关支持内容的详细信息,请参阅文档)

Android系统会根据屏幕方向,像素密度和提供的尺寸自动选择合适的布局。

对于您提供的布局,您使用了许多宽度/高度/边距的绝对测量值,这与传统的桌面UI设计相同。但是,正如您所发现的那样,在移动设备上,这种方法无法扩展(不是意图!) - 每种其他类型的屏幕/方向都不适合这些测量。您必须改变处理UI设计的方式。

在您的情况下,您的布局似乎表示用户必须填写的表单,该表单需要在2 - 5年的期间内定期每周或每月付款。这些元素已在两个轴上布局,以最大限度地利用可用的屏幕区域,这导致了进一步的问题。

首先,您可以将布局分解为两个图块 - 左侧是“生成”和“4年”年份按钮,右侧是初始/每周/每月付款摘要。这些只能是水平方向模式下外部RelativeLayout内的两个LinearLayout容器。 (然后,您可以为纵向屏幕创建布局,唯一的区别是LinearLayout设置为垂直方向,从而使两个图块显示为单个垂直列。)

对于两个子布局中的每一个,请确保按钮和标签相对于其父级对齐。避免给出元素的绝对宽度或高度 - 尽可能WRAP_CONTENTMATCH_PARENT。边距相同 - 边距最适合在相邻元素之间创建小间隙,并且很少用于在屏幕上定位项目。确保将DP尺寸用于文字大小。

这种相对定位和测量的使用将有助于保持所有UI元素对其显示的屏幕的响应。继续在几种不同的屏幕尺寸和方向上测试您的UI,以便掌握它们的外观。

这应该让你开始。这真的是一个理解Android的各种布局如何设计让你使用多个屏幕,以及如何绝对定位是魔鬼的情况!