2012-01-19 2 views
1

私は、複数のデバイスレイアウトとAndroidのドキュメントに関する他の記事をすべて読んだことがあります。Androidの複数のデバイスのレイアウトを理解する

HTC Sensation HDを使用してこのアプリケーションをテストしたのは間違いです。だから、私がHTC Desire(中程度の画面解像度)でそれをエミュレートすることに決めたとき、それはあまりフィットしないという私のショックを想像してください。

私はすべてのためにDIPを使用しました。では、Desireの中解像度でエミュレータを使用すると、画面上の半分の画面が消えるのはなぜですか。私はそれがちょうど縮小すると思った。そうでなければ、私は何をすべきですか?

結果の画像を添付しました。 Workingプロジェクト(落ちたバージョン)のドロップボックスダウンロードとここに添付されたXML。ご覧のとおり、4つのコントロールがページから削除されました。

大、中、小型デバイスで動作するには、このアプリケーションが必要です。 (センセーションHD、欲望、チャチャ)。どんな助言も素晴らしいだろう。

PROJECT LINK

enter image description here

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:id="@+id/main_layout" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:orientation="vertical" 
android:paddingLeft="20dip" 
android:paddingRight="20dip" > 

<ImageView 
    android:id="@+id/clientLogo_TextView" 
    android:layout_width="wrap_content" 
    android:layout_height="120dip" 
    android:layout_centerInParent="true" 
    android:layout_gravity="center_horizontal|center_vertical" 
    android:layout_marginBottom="15dip" 
    android:layout_marginTop="15dip" 
    android:src="@drawable/logotop" 
    android:adjustViewBounds="true"/> 

<Button 
    android:id="@+id/buttonOne_Button" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:layout_marginBottom="5dip" 
    android:text="Button One" > 
</Button> 

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:background="@drawable/customshape" 
    android:orientation="vertical" 
    android:padding="7dip" > 

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

     <TextView 
      android:id="@+id/labelOne_TextView" 
      android:layout_height="wrap_content" 
      android:layout_width="wrap_content" 
      android:text="Label One" 
      android:textStyle="bold" > 
     </TextView> 

     <TextView 
      android:id="@+id/labelTwo_TextView" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Label Two" 
      android:textSize="13dip" > 
     </TextView> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center_vertical|center_horizontal" 
     android:orientation="horizontal" > 

     <Button 
      android:id="@+id/buttonTwo_Button" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center_vertical" 
      android:singleLine="true" 
      android:text="Button Two" 
      android:textSize="16dip" > 
     </Button> 
    </LinearLayout> 

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

     <TextView 
      android:id="@+id/sliderLabel_TextView" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginRight="5dip" 
      android:text="Slider" 
      android:textStyle="bold" > 
     </TextView> 

     <TextView 
      android:id="@+id/sliderStatus_TextView" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text=" - Status" 
      android:textSize="13dip" > 
     </TextView> 
    </LinearLayout> 

    <SeekBar 
     android:id="@+id/sliderOne_SeekView" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:max="10" > 
    </SeekBar> 

    <TextView 
     android:id="@+id/labelThree_TextView" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="Label Three" 
     android:textStyle="bold" > 
    </TextView> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="45dip" 
     android:layout_gravity="center_vertical|center_horizontal" 
     android:orientation="horizontal" > 

     <Spinner 
      android:id="@+id/spinnerOne_Spinner" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" > 
     </Spinner> 

     <Spinner 
      android:id="@+id/spinnerTwo_Spinner" 
      android:layout_width="wrap_content" 
      android:layout_height="45dip" 
      android:layout_weight="1" > 
     </Spinner> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center_vertical|center_horizontal" 
     android:orientation="horizontal" 
     android:weightSum="1.0" > 

     <LinearLayout 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center_vertical|center_horizontal" 
      android:layout_weight="0.5" 
      android:orientation="vertical" 
      android:weightSum="1.0" > 

      <TextView 
       android:id="@+id/labelFour_TextView" 
       android:layout_width="wrap_content" 
       android:layout_height="fill_parent" 
       android:layout_weight=".2" 
       android:gravity="center_vertical|center_horizontal" 
       android:text="Label Four" 
       android:textStyle="bold" > 
      </TextView> 

      <Spinner 
       android:id="@+id/spinnerThree_Spinner" 
       android:layout_width="fill_parent" 
       android:layout_height="45dip" 
       android:layout_weight=".4" > 
      </Spinner> 
     </LinearLayout> 

     <LinearLayout 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center_vertical|center_horizontal" 
      android:layout_weight="0.5" 
      android:orientation="vertical" 
      android:weightSum="1.0" > 

      <TextView 
       android:id="@+id/labelFire_TextView" 
       android:layout_width="wrap_content" 
       android:layout_height="fill_parent" 
       android:layout_weight=".2" 
       android:gravity="center_vertical|center_horizontal" 
       android:text="Label Five" 
       android:textStyle="bold" > 
      </TextView> 

      <Spinner 
       android:id="@+id/spinnerFour_Spinner" 
       android:layout_width="fill_parent" 
       android:layout_height="45dip" 
       android:layout_weight=".4" > 
      </Spinner> 
     </LinearLayout> 
    </LinearLayout> 
</LinearLayout> 

<LinearLayout 
    android:id="@+id/ButtonsLayout" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:layout_marginTop="10dip" > 

    <Button 
     android:id="@+id/buttonThree_Button" 
     android:layout_width="fill_parent" 
     android:layout_height="45dip" 
     android:layout_margin="0dip" 
     android:layout_weight="1" 
     android:text="Button Three" > 
    </Button> 

    <Button 
     android:id="@+id/buttonFour_Button" 
     android:layout_width="fill_parent" 
     android:layout_height="45dip" 
     android:layout_weight="1" 
     android:text="Button Four" > 
    </Button> 
</LinearLayout> 

+0

サイドノートは、フォントサイズにdp/dipの代わりにspを使用してください。 – kabuko

答えて

3

デバイス非依存ピクセル(DIP)は、異なる画面上密度あなたのピクセルの測定を均一にすることを意図しています。画面のサイズと密度は2つの異なるものです。物理的な画面サイズにまたがるようにレイアウトをコード化する必要があります。

たとえば、ほぼすべての10インチタブレットでは、画面サイズが「超大」であるにもかかわらず中密度の画面が表示されます。これは、画面が物理的に大きくても、ギャラクシーネクサスなどのハイエンド携帯電話のように、ピクセルで密集していないためです。

レイアウトが異なる画面サイズに適応するためには、レイアウトの構造でこれを考慮する必要があります。これは、いくつかのことを意味します。

  • 可能な限りハードコードされた寸法を避けてください。可能であれば、match_parentを使用して、UIウィジェットに使用可能なスペースを含めることができます。
  • 多くのコントロールが重複しないようにしてください。 を使用する最小のデバイスの画面から外したり、コントロールをScrollViewに入れてください。
  • センターコントロールは で利用可能な画面スペースです。 LinearLayoutなどの レイアウトコンテナを使用して一連のコントロールをグループ化し、別のレイアウトマネージャー にandroid:layout_gravityと重複するように配置することができます。一部のウィジェットで android:gravity(特にTextViewImageView) を使用して、ビュー自体の境界内にコンテンツを配置することもできます。
  • Androidは、7インチのタブレットや3インチの携帯電話など、特定のクラスのデバイスのレイアウトをカスタマイズする必要がある場合は、画面のサイズと密度の組み合わせごとにカスタムレイアウトを作成できます。 Android SDK docsを参照してください。
  • 非常に広い範囲の画面にまたがるには、 Fragments APIを利用して関連するレイアウトをタブレットサイズの画面に積み重ねることができますが、 は電話画面で個別に表示します。

他の手法もありますが、重要なことは、dipを使用してもレイアウトが自動的にすべての画面サイズに拡大されるわけではありません。画面サイズと密度のマトリックスに対処する必要があります。

+0

+1 - これはすばらしい答えです。もし私がこれを最初から知っていれば。だから、最初に欲望のような中密度の電話のために働くレイアウトを得ることが最善です。高さの指定は避けてください。小さな携帯電話のスクロール表示を使用し、より高密度の携帯電話用に新しいレイアウトを完全に書き留めますか?私は携帯電話の人気の範囲をカバーする必要があります。しかし、クライアントは上記のレイアウトを望んでいるので、そこにあるものを単純化するオプションはありません。設計プロセスにどのようにアプローチするかについてのアドバイスは素晴らしいでしょう。 –

関連する問題