XML对齐问题想有四个imageviews相对布局是在中间的任何屏幕上

问题描述：

我有例如一个问题，我做 XML对齐问题想有四个imageviews相对布局是在中间的任何屏幕上

这样的关系6，当我改变较小的屏幕上发生的一样：

我在做什么错在哪里？我完全在这个XML新。以前从不需要它。我的XML：

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/activity" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:paddingBottom="@dimen/activity_vertical_margin" 
    android:paddingLeft="@dimen/activity_horizontal_margin" 
    android:paddingRight="@dimen/activity_horizontal_margin" 
    android:paddingTop="@dimen/activity_vertical_margin" 
    tools:context="com.example.xxx" 
    android:background="@android:color/darker_gray"> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="@string/_00" 
     android:id="@+id/textViewSomething" 
     android:textSize="30sp" 
     android:textStyle="normal|bold" 
     android:layout_above="@+id/buttonStart" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentStart="true" 
     android:layout_marginBottom="22dp" /> 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="100dp" 
     android:background="@android:color/darker_gray" 
     android:layout_centerInParent="false" 
     android:layout_alignWithParentIfMissing="true" 
     android:layout_alignParentTop="true" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentStart="true"> 

     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      app:srcCompat="@drawable/nine" 
      android:id="@+id/imageView2" 
      android:layout_alignParentTop="true" 
      android:layout_toLeftOf="@+id/imageView" 
      android:layout_toStartOf="@+id/imageView" /> 

     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      app:srcCompat="@drawable/nine" 
      android:id="@+id/imageView6" 
      android:layout_alignParentTop="true" 
      android:layout_toLeftOf="@+id/imageView2" 
      android:layout_toStartOf="@+id/imageView2" /> 

     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      app:srcCompat="@drawable/nine" 
      android:id="@+id/imageView5" 
      android:layout_alignParentTop="true" 
      android:layout_toLeftOf="@+id/imageView6" 
      android:layout_toStartOf="@+id/imageView6" /> 

     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      app:srcCompat="@drawable/zero" 
      android:id="@+id/imageView" 
      android:contentDescription="" 
      android:layout_marginRight="50dp" 
      android:layout_marginEnd="50dp" 
      android:layout_alignParentTop="true" 
      android:layout_alignParentRight="true" 
      android:layout_alignParentEnd="true" /> 
    </RelativeLayout> 
</RelativeLayout>

我要的是这个4的ImageView是在中间。他们应该粘在一起，左右之间有相同的空间。并适合任何屏幕大小。

答

将它们放在LinearLayout，而不是设置为横向：

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="100dp" 
    android:background="@android:color/darker_gray" 
    android:gravity="center" 
    android:orientation="horizontal" 
    android:layout_alignParentTop="true" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentStart="true"> 

    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     app:srcCompat="@drawable/nine" 
     android:id="@+id/imageView2" 
     /> 

    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     app:srcCompat="@drawable/nine" 
     android:id="@+id/imageView6" 
     /> 

    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     app:srcCompat="@drawable/nine" 
     android:id="@+id/imageView5" 
     /> 

    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     app:srcCompat="@drawable/zero" 
     android:id="@+id/imageView" 
     android:contentDescription="" 
     /> 
</LinearLayout>

谢谢你的帮助。 – Mjafko

@Mjafko我建议你让你的命名约定更好一些，imageview6不是很清楚，可以使开发更难，一个更好的名字，告诉你imageview是什么将是更好的选择 – MichaelStoddart

不用担心，我会的。只需打开项目并将元素添加到此处即可复制代码。现在只需要弄清楚如何调整大小以适应屏幕。 Bacicicly希望它在每个屏幕上的图像周围都有相同的空间 – Mjafko

答

您可以使用LinearLayout内部的4个ImageViews，其中RelativeLayout内的水平引力。尝试使用这个：

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/activity" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@android:color/darker_gray" 
    android:paddingBottom="@dimen/activity_vertical_margin" 
    android:paddingLeft="@dimen/activity_horizontal_margin" 
    android:paddingRight="@dimen/activity_horizontal_margin" 
    android:paddingTop="@dimen/activity_vertical_margin"> 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="100dp" 
     android:background="@android:color/darker_gray"> 

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

      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" /> 

      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" /> 

      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" /> 

      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" /> 
     </LinearLayout> 
    </RelativeLayout> 
</RelativeLayout>

答

为什么RelativeLayout？具有重心的LinearLayout会很好。特别是如果你想让图像具有相同的尺寸，你可以使用LinearLayout的weight属性。

谢谢。我如何设法调整图像大小以适应屏幕大小？ – Mjafko

答

而不是相对布局四象，使用的LinearLayout与weightSum财产。下面是示例：

<LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="100dp" 
     android:background="@android:color/darker_gray" 
     android:layout_centerInParent="false" 
     android:layout_alignWithParentIfMissing="true" 
     android:layout_alignParentTop="true" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentStart="true" 
     android:orientation="horizontal" 
     android:weightSum="1"> 

     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      app:srcCompat="@drawable/nine" 
      android:id="@+id/imageView2" 
      android:layout_alignParentTop="true" 
      android:layout_toLeftOf="@+id/imageView" 
      android:layout_toStartOf="@+id/imageView" 
      android:layout_weight="0.25"/> 

     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      app:srcCompat="@drawable/nine" 
      android:id="@+id/imageView6" 
      android:layout_alignParentTop="true" 
      android:layout_toLeftOf="@+id/imageView2" 
      android:layout_toStartOf="@+id/imageView2" 
      android:layout_weight="0.25"/> 

     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      app:srcCompat="@drawable/nine" 
      android:id="@+id/imageView5" 
      android:layout_alignParentTop="true" 
      android:layout_toLeftOf="@+id/imageView6" 
      android:layout_toStartOf="@+id/imageView6" 
      android:layout_weight="0.25"/> 

     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      app:srcCompat="@drawable/zero" 
      android:id="@+id/imageView" 
      android:contentDescription="" 
      android:layout_marginRight="50dp" 
      android:layout_marginEnd="50dp" 
      android:layout_alignParentTop="true" 
      android:layout_alignParentRight="true" 
      android:layout_alignParentEnd="true" 
      android:layout_weight="0.25"/> 
    </LinearLayout>

答

试试这个：

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       xmlns:app="http://schemas.android.com/apk/res-auto" 
       xmlns:tools="http://schemas.android.com/tools" 
       android:id="@+id/activity" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:paddingBottom="@dimen/activity_vertical_margin" 
       android:paddingLeft="@dimen/activity_horizontal_margin" 
       android:paddingRight="@dimen/activity_horizontal_margin" 
       android:paddingTop="@dimen/activity_vertical_margin" 
       android:background="@android:color/darker_gray"> 



    <LinearLayout 
     android:id="@+id/buttonStart" 
     android:layout_width="match_parent" 
     android:layout_height="100dp" 
     android:orientation="horizontal" 
     android:background="@android:color/darker_gray" 
     android:layout_centerInParent="false" 
     android:layout_alignWithParentIfMissing="true" 
     android:layout_alignParentTop="true" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentStart="true"> 

     <ImageView 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_height="wrap_content" 
      android:id="@+id/imageView2" 
      app:srcCompat="@drawable/nine" 
      android:layout_alignParentTop="true" 
      android:layout_toLeftOf="@+id/imageView" 
      android:layout_toStartOf="@+id/imageView" /> 

     <ImageView 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_height="wrap_content" 
      android:id="@+id/imageView6" 
      android:layout_alignParentTop="true" 
      app:srcCompat="@drawable/nine" 
      android:layout_toLeftOf="@+id/imageView2" 
      android:layout_toStartOf="@+id/imageView2" /> 

     <ImageView 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_height="wrap_content" 
      android:id="@+id/imageView5" 
      app:srcCompat="@drawable/nine" 
      android:layout_alignParentTop="true" 
      android:layout_toLeftOf="@+id/imageView6" 
      android:layout_toStartOf="@+id/imageView6" /> 

     <ImageView 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_height="wrap_content" 
      android:id="@+id/imageView" 
      android:contentDescription="" 
      app:srcCompat="@drawable/nine" 
      android:layout_marginRight="50dp" 
      android:layout_marginEnd="50dp" 
      android:layout_alignParentTop="true" 
      android:layout_alignParentRight="true" 
      android:layout_alignParentEnd="true" /> 
    </LinearLayout> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:id="@+id/textViewSomething" 
     android:textSize="30sp" 
     android:textStyle="normal|bold" 
     android:layout_above="@+id/buttonStart" 
     android:text="@string/_00" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentStart="true" 
     android:layout_marginBottom="22dp" /> 

</RelativeLayout>

XML对齐问题想有四个imageviews相对布局是在中间的任何屏幕上

相关推荐