Mise en page relative désorganisée à l'exécution

Question

J'ai un problème de mise en page relative dans mon application. Le problème est seulement dans une activité et un fragment malgré moi en utilisant des dispositions similaires dans plus de 20 autres activités et fragments. Dans ma conception XML, la mise en page semble très bien comme suit.

Cependant, au moment de l'exécution, la conception de la mise en page est foiré. Voici une capture d'écran de la mise en page pendant l'exécution.

Pourquoi ai-je ce problème? Voici ma mise en page.

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@color/white"> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:background="@drawable/moments_toolbar_background" 
     android:minHeight="?attr/actionBarSize"> 

     <include layout="@layout/toolbar_ollamoments_comment" /> 

    </android.support.v7.widget.Toolbar> 

    <ScrollView 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 

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

      <RelativeLayout 
       android:layout_width="match_parent" 
       android:layout_height="70dp" 
       android:gravity="left"> 

       <ImageView 
        android:id="@+id/settingsImageViewAccount" 
        android:layout_width="16dp" 
        android:layout_height="16dp" 
        android:layout_marginLeft="20dp" 
        android:layout_marginStart="20dp" 
        android:layout_marginEnd="20dp" 
        android:layout_marginRight="20dp" 
        android:src="@mipmap/ic_olla_settings_moments_private" 
        android:layout_centerVertical="true" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true"/> 

       <TextView 
        android:id="@+id/accountSettingsTextViewEditUsername" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:text="Make profile private" 
        android:layout_marginLeft="5dp" 
        android:textSize="@dimen/text_size_medium" 
        android:textColor="@color/settingsMoodTextColor" 
        android:layout_toRightOf="@+id/settingsImageViewAccount" 
        android:layout_toLeftOf="@+id/momentSettingsSwitchProfilePrivacy" 
        android:layout_toStartOf="@+id/momentSettingsSwitchProfilePrivacy" /> 

       <android.support.v7.widget.SwitchCompat 
        android:id="@+id/momentSettingsSwitchProfilePrivacy" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentRight="true" 
        android:layout_marginRight="15dp" 
        android:layout_centerVertical="true" 
        android:theme="@style/CustomSwitch" 
        android:checked="true" /> 

       <View 
        android:layout_width="wrap_content" 
        android:layout_height="1dp" 
        android:layout_alignParentBottom="true" 
        android:layout_alignParentEnd="true" 
        android:layout_alignParentRight="true" 
        android:background="@color/ollamoments_options_divider_color" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true" 
        android:layout_marginLeft="15dp" 
        android:layout_marginRight="15dp" 
        android:layout_marginEnd="15dp" 
        android:layout_marginStart="15dp"/> 

      </RelativeLayout> 

      <RelativeLayout 
       android:layout_width="match_parent" 
       android:layout_height="70dp"> 

       <ImageView 
        android:id="@+id/settingsImageViewPhoneNumber" 
        android:layout_width="16dp" 
        android:layout_height="16dp" 
        android:layout_marginLeft="20dp" 
        android:layout_marginStart="20dp" 
        android:layout_marginEnd="20dp" 
        android:layout_marginRight="20dp" 
        android:src="@mipmap/ic_olla_settings_moments_message" 
        android:layout_centerVertical="true" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true"/> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:text="Show my phone number on my public profile" 
        android:layout_marginLeft="5dp" 
        android:textSize="@dimen/text_size_medium" 
        android:textColor="@color/settingsMoodTextColor" 
        android:layout_toRightOf="@+id/settingsImageViewPhoneNumber"/> 
<!-- 
       android:layout_toLeftOf="@+id/momentSettingsSwitchMessages" 
       android:layout_toStartOf="@+id/momentSettingsSwitchMessages"--> 

       <android.support.v7.widget.SwitchCompat 
        android:id="@+id/momentSettingsSwitchPhoneNumber" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentRight="true" 
        android:layout_marginRight="15dp" 
        android:layout_centerVertical="true" 
        android:theme="@style/CustomSwitch" 
        android:checked="true" /> 

       <View 
        android:layout_width="wrap_content" 
        android:layout_height="1dp" 
        android:layout_alignParentBottom="true" 
        android:layout_alignParentEnd="true" 
        android:layout_alignParentRight="true" 
        android:background="@color/ollamoments_options_divider_color" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true" 
        android:layout_marginLeft="15dp" 
        android:layout_marginRight="15dp" 
        android:layout_marginEnd="15dp" 
        android:layout_marginStart="15dp"/> 

      </RelativeLayout> 

      <RelativeLayout 
       android:layout_width="match_parent" 
       android:layout_height="70dp"> 

       <ImageView 
        android:id="@+id/settingsImageViewChats" 
        android:layout_width="16dp" 
        android:layout_height="16dp" 
        android:layout_marginLeft="20dp" 
        android:layout_marginStart="20dp" 
        android:layout_marginEnd="20dp" 
        android:layout_marginRight="20dp" 
        android:src="@mipmap/ic_olla_settings_moments_message" 
        android:layout_centerVertical="true" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true"/> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:text="Allow people to message me" 
        android:layout_marginLeft="5dp" 
        android:textSize="@dimen/text_size_medium" 
        android:textColor="@color/settingsMoodTextColor" 
        android:layout_toRightOf="@+id/settingsImageViewChats" 
        android:layout_toLeftOf="@+id/momentSettingsSwitchMessages" 
        android:layout_toStartOf="@+id/momentSettingsSwitchMessages" /> 

       <android.support.v7.widget.SwitchCompat 
        android:id="@+id/momentSettingsSwitchMessages" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentRight="true" 
        android:layout_marginRight="15dp" 
        android:layout_centerVertical="true" 
        android:theme="@style/CustomSwitch" 
        android:checked="true" /> 

       <View 
        android:layout_width="wrap_content" 
        android:layout_height="1dp" 
        android:layout_alignParentBottom="true" 
        android:layout_alignParentEnd="true" 
        android:layout_alignParentRight="true" 
        android:background="@color/ollamoments_options_divider_color" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true" 
        android:layout_marginLeft="15dp" 
        android:layout_marginRight="15dp" 
        android:layout_marginEnd="15dp" 
        android:layout_marginStart="15dp"/> 

      </RelativeLayout> 

      <RelativeLayout 
       android:layout_width="match_parent" 
       android:layout_height="70dp"> 

       <ImageView 
        android:id="@+id/settingsImageViewMoments" 
        android:layout_width="16dp" 
        android:layout_height="16dp" 
        android:layout_marginLeft="20dp" 
        android:layout_marginStart="20dp" 
        android:layout_marginEnd="20dp" 
        android:layout_marginRight="20dp" 
        android:src="@mipmap/ic_olla_group" 
        android:layout_centerVertical="true" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true"/> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:text="Allow moments to be discoverable for trending" 
        android:layout_marginLeft="5dp" 
        android:textSize="@dimen/text_size_medium" 
        android:textColor="@color/settingsMoodTextColor" 
        android:layout_toRightOf="@+id/settingsImageViewMoments" 
        android:layout_marginRight="5dp" 
        android:layout_marginEnd="5dp" 
        android:layout_toLeftOf="@+id/momentSettingsSwitchDiscoverable" 
        android:layout_toStartOf="@+id/momentSettingsSwitchDiscoverable" /> 

       <android.support.v7.widget.SwitchCompat 
        android:id="@+id/momentSettingsSwitchDiscoverable" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentRight="true" 
        android:layout_marginRight="15dp" 
        android:layout_centerVertical="true" 
        android:theme="@style/CustomSwitch" 
        android:checked="true" /> 

       <View 
        android:layout_width="wrap_content" 
        android:layout_height="1dp" 
        android:layout_alignParentBottom="true" 
        android:layout_alignParentEnd="true" 
        android:layout_alignParentRight="true" 
        android:background="@color/ollamoments_options_divider_color" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true" 
        android:layout_marginLeft="15dp" 
        android:layout_marginRight="15dp" 
        android:layout_marginEnd="15dp" 
        android:layout_marginStart="15dp"/> 

      </RelativeLayout> 

      <RelativeLayout 
       android:layout_width="match_parent" 
       android:layout_height="70dp"> 

       <ImageView 
        android:id="@+id/settingsImageViewSupport" 
        android:layout_width="16dp" 
        android:layout_height="16dp" 
        android:layout_marginLeft="20dp" 
        android:layout_marginStart="20dp" 
        android:layout_marginEnd="20dp" 
        android:layout_marginRight="20dp" 
        android:src="@mipmap/ic_olla_settings_moments_tagged" 
        android:layout_centerVertical="true" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true"/> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:text="Hide photos I'm tagged in" 
        android:layout_marginLeft="5dp" 
        android:layout_marginEnd="5dp" 
        android:layout_marginRight="5dp" 
        android:textSize="@dimen/text_size_medium" 
        android:textColor="@color/settingsMoodTextColor" 
        android:layout_toRightOf="@+id/settingsImageViewSupport" 
        android:layout_toLeftOf="@+id/momentSettingsSwitchHidePhotos" 
        android:layout_toStartOf="@+id/momentSettingsSwitchHidePhotos" /> 

       <android.support.v7.widget.SwitchCompat 
        android:id="@+id/momentSettingsSwitchHidePhotos" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentRight="true" 
        android:layout_marginRight="15dp" 
        android:layout_centerVertical="true" 
        android:theme="@style/CustomSwitch" 
        android:checked="true" /> 

       <View 
        android:layout_width="wrap_content" 
        android:layout_height="1dp" 
        android:layout_alignParentBottom="true" 
        android:layout_alignParentEnd="true" 
        android:layout_alignParentRight="true" 
        android:background="@color/ollamoments_options_divider_color" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true" 
        android:layout_marginLeft="15dp" 
        android:layout_marginRight="15dp" 
        android:layout_marginEnd="15dp" 
        android:layout_marginStart="15dp"/> 

      </RelativeLayout> 

      <RelativeLayout 
       android:layout_width="match_parent" 
       android:layout_height="70dp"> 

       <ImageView 
        android:id="@+id/settingsImageViewNotifications" 
        android:layout_width="16dp" 
        android:layout_height="16dp" 
        android:layout_marginLeft="20dp" 
        android:layout_marginStart="20dp" 
        android:layout_marginEnd="20dp" 
        android:layout_marginRight="20dp" 
        android:src="@mipmap/ic_olla_settings_moments_location" 
        android:layout_centerVertical="true" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true"/> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:text="Show my location" 
        android:layout_marginLeft="5dp" 
        android:layout_marginStart="5dp" 
        android:textSize="@dimen/text_size_medium" 
        android:textColor="@color/settingsMoodTextColor" 
        android:layout_toRightOf="@+id/settingsImageViewNotifications" 
        android:layout_toLeftOf="@+id/momentSettingsSwitchLocation" 
        android:layout_toStartOf="@+id/momentSettingsSwitchLocation" /> 

       <android.support.v7.widget.SwitchCompat 
        android:id="@+id/momentSettingsSwitchLocation" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentRight="true" 
        android:layout_marginRight="15dp" 
        android:layout_centerVertical="true" 
        android:theme="@style/CustomSwitch" 
        android:checked="true" /> 

       <View 
        android:layout_width="wrap_content" 
        android:layout_height="1dp" 
        android:layout_alignParentBottom="true" 
        android:layout_alignParentEnd="true" 
        android:layout_alignParentRight="true" 
        android:background="@color/ollamoments_options_divider_color" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true" 
        android:layout_marginLeft="15dp" 
        android:layout_marginRight="15dp" 
        android:layout_marginEnd="15dp" 
        android:layout_marginStart="15dp"/> 

      </RelativeLayout> 

      <RelativeLayout 
       android:layout_width="match_parent" 
       android:layout_height="70dp"> 

       <ImageView 
        android:id="@+id/settingsImageViewBlock" 
        android:layout_width="16dp" 
        android:layout_height="16dp" 
        android:layout_marginLeft="20dp" 
        android:layout_marginStart="20dp" 
        android:layout_marginEnd="20dp" 
        android:layout_marginRight="20dp" 
        android:src="@mipmap/ic_olla_group" 
        android:layout_centerVertical="true" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true"/> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:text="Block users" 
        android:layout_marginLeft="5dp" 
        android:layout_marginStart="5dp" 
        android:textSize="@dimen/text_size_medium" 
        android:textColor="@color/settingsMoodTextColor" 
        android:layout_toRightOf="@+id/settingsImageViewBlock" /> 

       <View 
        android:layout_width="wrap_content" 
        android:layout_height="1dp" 
        android:layout_alignParentBottom="true" 
        android:layout_alignParentEnd="true" 
        android:layout_alignParentRight="true" 
        android:background="@color/ollamoments_options_divider_color" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true" 
        android:layout_marginLeft="15dp" 
        android:layout_marginRight="15dp" 
        android:layout_marginEnd="15dp" 
        android:layout_marginStart="15dp"/> 

      </RelativeLayout> 

      <RelativeLayout 
       android:layout_width="match_parent" 
       android:layout_height="70dp"> 

       <ImageView 
        android:id="@+id/settingsImageViewReccomendations" 
        android:layout_width="16dp" 
        android:layout_height="16dp" 
        android:layout_marginLeft="20dp" 
        android:layout_marginStart="20dp" 
        android:layout_marginEnd="20dp" 
        android:layout_marginRight="20dp" 
        android:src="@mipmap/ic_olla_group" 
        android:layout_centerVertical="true" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true"/> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:text="Recommend people to follow" 
        android:layout_marginLeft="5dp" 
        android:layout_marginStart="5dp" 
        android:layout_marginRight="5dp" 
        android:layout_marginEnd="5dp" 
        android:textSize="@dimen/text_size_medium" 
        android:textColor="@color/settingsMoodTextColor" 
        android:layout_toRightOf="@+id/settingsImageViewReccomendations" 
        android:layout_toLeftOf="@+id/momentSettingsSwitchRecommend" 
        android:layout_toStartOf="@+id/momentSettingsSwitchRecommend" /> 

       <android.support.v7.widget.SwitchCompat 
        android:id="@+id/momentSettingsSwitchRecommend" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentRight="true" 
        android:layout_marginRight="15dp" 
        android:layout_centerVertical="true" 
        android:theme="@style/CustomSwitch" 
        android:checked="true" /> 

       <View 
        android:layout_width="wrap_content" 
        android:layout_height="1dp" 
        android:layout_alignParentBottom="true" 
        android:layout_alignParentEnd="true" 
        android:layout_alignParentRight="true" 
        android:background="@color/ollamoments_options_divider_color" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true" 
        android:layout_marginLeft="15dp" 
        android:layout_marginRight="15dp" 
        android:layout_marginEnd="15dp" 
        android:layout_marginStart="15dp"/> 

      </RelativeLayout> 

     </LinearLayout> 

    </ScrollView> 

</LinearLayout> 

Answer 1

Vous ne pouvez pas aligner TextView à droite de l'image et à gauche du commutateur. Vous ne pouvez l'aligner qu'avec l'une des vues. Votre aperçu le montre comme aligné à gauche mais le téléphone le montre comme aligné à droite.

Ma recommandation est d'aligner le texte avec ImageView et d'ajouter une marge sur le côté droit du TextView à peu près à la taille du Switch.

<TextView 
    android:id="@+id/accountSettingsTextViewEditUsername" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerVertical="true" 
    android:text="Make profile private" 
    android:layout_marginLeft="5dp" 
    android:textSize="@dimen/text_size_medium" 
    android:textColor="@color/settingsMoodTextColor" 
    android:layout_toRightOf="@+id/settingsImageViewAccount" 
    android:layout_marginRight="48dp" /> 

Faites-en l'essai. Vous devrez peut-être modifier le 48dp si vous trouvez que le texte est en cours d'exécution dans le commutateur. Vous voudriez évidemment faire un changement similaire pour les autres paramètres.