2017-08-08 111 views
0

我比Swift更喜欢Swift,但我正在尝试学习它。Android XML:设备更改时的布局行更改

随着Swift我使用自动布局的约束,使我的布局很容易。我似乎无法达到我想要的Android XML。

我正在创建自定义列表视图行。我希望该行与图像(128px)的高度相同或更少。然后,我希望标题居中并在标题下方,每个文本有2个图像。

  • 使用相对布局,我将图像设置为128x128。
  • 场景标题要中心对齐,并在主要 图像的左侧放置30dp。
  • 其他2个图像和文本的意见总是低于标题
  • 第一个“SceneOptionImage”符合题
  • 其他意见只是走在一条线上“sceneOptionImage”
后开始

我以为我把它作为较小的设备预览它看起来很好。但是,当我向上移动屏幕分辨率时,就好像该行的高度变小了一样。

4.0英寸屏幕:

enter image description here

6.0英寸屏幕:

enter image description here

那么,为什么行的高度出现改变?

我可以得到一些指针吗?谢谢。

以下是完整的XML代码以供参考:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="128px" 
    android:orientation="vertical"> 

    <ImageView 
     android:id="@+id/sceneImage" 
     android:layout_width="128px" 
     android:layout_height="128px" 
     android:layout_margin="0px" 
     app:srcCompat="@mipmap/clipboard" 
     android:layout_alignParentTop="true" 
     android:layout_alignParentStart="true" /> 

    <TextView 
     android:id="@+id/sceneName" 
     android:layout_width="200dp" 
     android:layout_height="wrap_content" 
     android:layout_alignParentTop="true" 
     android:layout_marginTop="20dp" 
     android:text="Scene Title" 
     android:layout_toEndOf="@id/sceneImage" 
     android:layout_marginLeft="30dp" 
     android:gravity="center"/> 

    <ImageView 
     android:id="@+id/sceneOptionImage" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     app:srcCompat="@mipmap/forest" 
     android:layout_below="@+id/sceneName" 
     android:layout_alignStart="@+id/sceneName" 
     android:layout_marginTop="18dp" /> 

    <TextView 
     android:id="@+id/sceneOptionText" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginStart="8dp" 
     android:layout_toEndOf="@+id/sceneOptionImage" 
     android:layout_below="@id/sceneName" 
     android:layout_marginTop="20dp" 
     android:text="TextView" /> 

    <ImageView 
     android:id="@+id/sceneColourImage" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginLeft="70dp" 
     app:srcCompat="@mipmap/forest" 
     android:layout_below="@+id/sceneName" 
     android:layout_alignStart="@+id/sceneOptionText" 
     android:layout_marginTop="18dp" /> 

    <TextView 
     android:id="@+id/sceneColourText" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginStart="8dp" 
     android:layout_toEndOf="@+id/sceneColourImage" 
     android:layout_below="@id/sceneName" 
     android:layout_marginTop="20dp" 
     android:text="TextView" /> 
</RelativeLayout> 
+4

使用'dp',而不是'px' –

+0

管理布局也许你应该尝试[ConstraintLayour](https://developer.android.com/training/ constraint-layout/index.html) –

+0

那么这是一个简单的修复。谢谢。任何机会你可以解释为什么dp对于所有设备都是一样的,而px不是? – jackabe

回答

0

Image

解决问题的方法是体重总和。这将允许您在不同的屏幕尺寸

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="128dp" 
    android:orientation="vertical"> 

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

     <LinearLayout 
      android:gravity="center" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1"> 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@mipmap/ic_launcher"/> 
     </LinearLayout> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.5" 
      android:orientation="vertical"> 

      <LinearLayout 
       android:gravity="center" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:layout_weight="1"> 
       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Scene Title"/> 
      </LinearLayout> 

      <LinearLayout 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:layout_weight="1" 
       android:orientation="horizontal"> 

       <LinearLayout 
        android:gravity="center" 
        android:layout_weight="1" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent"> 
        <ImageView 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:src="@mipmap/ic_launcher"/> 
        <TextView 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:text="Text View"/> 
       </LinearLayout> 
       <LinearLayout 
        android:gravity="center" 
        android:layout_weight="1" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent"> 
        <ImageView 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:src="@mipmap/ic_launcher"/> 
        <TextView 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:text="Text View"/> 
       </LinearLayout> 

      </LinearLayout> 
     </LinearLayout> 
    </LinearLayout> 
</LinearLayout>