在RelativeLayout

时间:2017-01-25 18:37:32

标签: android android-layout android-relativelayout

我在左侧使用带有ImageView的RelativeLayout。在这里,我用150dp对layout_width进行了硬编码,但这在其他屏幕上看起来不太好。在更大的屏幕上,150dp相当少。所以我考虑使用layout_weight但我不能在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"
            android:id="@+id/layout_quiz"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:fitsSystemWindows="true"
    android:minHeight="?attr/actionBarSize"
    android:padding="2dp"
    app:titleMarginStart="20dp"
    app:titleTextAppearance="@style/MyMaterialTheme.Base.TitleTextStyle"
    app:titleTextColor="@color/textColorPrimary">

    <TextView
        android:id="@+id/toolbar_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textColor="@android:color/white"
        android:textStyle="bold|italic"/>

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

<TextView
    android:id="@+id/tv_topic"
    android:layout_width="150dp"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:layout_below="@+id/toolbar"
    android:background="@android:color/holo_green_light"
    android:gravity="center"
    android:padding="5dp"
    android:textColor="@android:color/white"/>

<RelativeLayout
    android:id="@+id/layout_question"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/toolbar"
    android:layout_toEndOf="@+id/tv_topic"
    android:layout_toRightOf="@+id/tv_topic"
    android:gravity="top"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/tv_question"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_toLeftOf="@+id/bt_favorite"
        android:padding="5dp"
        android:text="Schritte der Trainingssteuerung. Was ist hier richtige Reihenfolge?"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textStyle="bold"/>

    <ImageButton
        android:id="@+id/bt_favorite"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:background="#00ffffff"
        android:src="@drawable/star"/>
</RelativeLayout>

<View
    android:layout_width="fill_parent"
    android:layout_height="1dp"
    android:layout_alignBottom="@+id/layout_question"
    android:layout_toEndOf="@+id/tv_topic"
    android:layout_toRightOf="@+id/tv_topic"
    android:background="?android:attr/listDivider"/>

<View
    android:id="@+id/view"
    android:layout_width="1dp"
    android:layout_height="fill_parent"
    android:layout_below="@+id/toolbar"
    android:layout_toEndOf="@+id/iv_image"
    android:layout_toRightOf="@+id/iv_image"  
    android:background="?android:attr/listDivider"/>

<LinearLayout
    android:id="@+id/layout_multiplechoice"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/layout_question"
    android:layout_margin="5dp"
    android:layout_toEndOf="@+id/iv_image"
    android:layout_toRightOf="@+id/iv_image"
    android:orientation="horizontal">

    <LinearLayout
        android:id="@+id/layout_multiplechoice_solutions"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="center_vertical"
        android:orientation="vertical"
        android:visibility="invisible">

        <CheckBox
            android:id="@+id/cb_solution1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:enabled="false"/>

        <CheckBox
            android:id="@+id/cb_solution2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:enabled="false"/>

        <CheckBox
            android:id="@+id/cb_solution3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:enabled="false"/>

        <CheckBox
            android:id="@+id/cb_solution4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:enabled="false"/>

        <CheckBox
            android:id="@+id/cb_solution5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:enabled="false"/>
    </LinearLayout>

    <LinearLayout
        android:id="@+id/layout_multiplechoice_answers"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="center_vertical"
        android:orientation="vertical">

        <CheckBox
            android:id="@+id/cb_answer1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:buttonTint="@android:color/holo_green_light"/>

        <CheckBox
            android:id="@+id/cb_answer2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:buttonTint="@android:color/holo_green_light"/>

        <CheckBox
            android:id="@+id/cb_answer3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:buttonTint="@android:color/holo_green_light"/>

        <CheckBox
            android:id="@+id/cb_answer4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:buttonTint="@android:color/holo_green_light"/>

        <CheckBox
            android:id="@+id/cb_answer5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:buttonTint="@android:color/holo_green_light"/>
    </LinearLayout>
</LinearLayout>

<LinearLayout
    android:id="@+id/layout_singlechoice"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/layout_question"
    android:layout_margin="5dp"
    android:layout_toEndOf="@+id/iv_image"
    android:layout_toRightOf="@+id/iv_image"
    android:orientation="horizontal"
    android:visibility="gone">

    <LinearLayout
        android:id="@+id/layout_singlechoice_solutions"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="center_vertical"
        android:orientation="vertical"
        android:visibility="invisible">

        <RadioGroup
            android:id="@+id/rg_solution_group"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">
            <RadioButton
                android:id="@+id/rb_solution1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:enabled="false"/>

            <RadioButton
                android:id="@+id/rb_solution2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:enabled="false"/>

            <RadioButton
                android:id="@+id/rb_solution3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:enabled="false"/>

            <RadioButton
                android:id="@+id/rb_solution4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:enabled="false"/>

            <RadioButton
                android:id="@+id/rb_solution5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:enabled="false"/>
        </RadioGroup>
    </LinearLayout>

    <LinearLayout
        android:id="@+id/layout_singlechoice_answers"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="center_vertical"
        android:orientation="vertical">

        <RadioGroup
            android:id="@+id/rg_answer_group"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

            <RadioButton
                android:id="@+id/rb_answer1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

            <RadioButton
                android:id="@+id/rb_answer2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

            <RadioButton
                android:id="@+id/rb_answer3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

            <RadioButton
                android:id="@+id/rb_answer4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

            <RadioButton
                android:id="@+id/rb_answer5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>
        </RadioGroup>
    </LinearLayout>
</LinearLayout>


<LinearLayout
    android:id="@+id/layout_info"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_above="@+id/layout_progressbar"
    android:layout_below="@+id/layout_question"
    android:layout_toEndOf="@+id/iv_image"
    android:layout_toRightOf="@+id/iv_image"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tv_infotitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="7dp"
        android:textStyle="bold"/>

    <ScrollView android:id="@+id/sv_infoscroller"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fillViewport="true">

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


            <TextView
                android:id="@+id/tv_infotext"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/tv_infotitle"
                android:layout_margin="7dp"
                android:scrollbars="vertical"/>

            <ImageView
                android:id="@+id/iv_infopicture"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/tv_infotext"
                android:layout_margin="7dp"/>
        </LinearLayout>

    </ScrollView>

</LinearLayout>

<View
    android:layout_width="fill_parent"
    android:layout_height="1dp"
    android:layout_alignTop="@+id/layout_progressbar"
    android:layout_marginTop="5dp"
    android:layout_toEndOf="@+id/iv_image"
    android:layout_toRightOf="@+id/iv_image"
    android:background="?android:attr/listDivider"/>

<RelativeLayout
    android:id="@+id/layout_progressbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_toEndOf="@+id/view"   
android:layout_toRightOf="@+id/view" android:gravity="bottom"  
android:orientation="horizontal">

    <ImageButton
        android:id="@+id/bt_next"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_marginTop="5dp"
        android:enabled="false"
        android:src="@drawable/ic_arrow_right"
        android:text="@string/next"/>

    <ImageButton
        android:id="@+id/bt_info"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="16dp"
        android:layout_marginTop="15dp"
        android:layout_toLeftOf="@+id/bt_next"
        android:layout_toStartOf="@+id/bt_next"
        android:background="@null"
        android:src="@drawable/ic_info"
        android:visibility="invisible"/>

    <TextView
        android:id="@+id/tv_resultmessage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_margin="15dp"/>

    <ImageButton
        android:id="@+id/bt_back"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginTop="5dp"
        android:src="@drawable/ic_arrow_left"
        android:text="@string/back"/>

    <ProgressBar
        android:id="@+id/pb_quiz"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/bt_back"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="5dp"
        android:progress="1"/>
</RelativeLayout>
<ImageView
    android:id="@+id/iv_image"
    android:layout_width="150dp"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true" android:layout_alignParentStart="true" android:layout_below="@id/toolbar" android:src="@drawable/schmuck"/>

enter image description here

你知道解决方案吗?

3 个答案:

答案 0 :(得分:4)

您可以使用PercentRelativeLayout

     <android.support.percent.PercentRelativeLayout
     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="match_parent">
     <ImageView
         app:layout_widthPercent="50%"
         app:layout_heightPercent="50%"
         app:layout_marginTopPercent="25%"
         app:layout_marginLeftPercent="25%"/>
 </android.support.percent.PercentRelativeLayout>

将此添加到您的gradle依赖项:

compile 'com.android.support:percent:22.2.0'

查看官方docs

答案 1 :(得分:0)

您应该根据屏幕大小在两个dimens.xml中定义一个维度。然后,对于相同的维度res,您可以在dp中指定不同的值。

为此,您可以创建一些文件夹,如

<form class="form-horizontal" asp-antiforgery="true">
  <fieldset>
    // All of this instead of @Html.ValidationSummary(false) due to a bug in ASP.NET Core 1.0
    @if (!@ViewData.ModelState.IsValid)
    {
        var errors = ViewData.ModelState.Values.Select(item => item.Errors.FirstOrDefault()?.ErrorMessage).Where(item => item != null);
        <div class="alert alert-danger">
            <span>@Localizer["There are problems with your input:"]</span>
            <ul>
                @foreach (var error in errors)
                {
                    <li>@error</li>
                }
            </ul>
        </div>
    }

    // Some actual fields. Don't forget validation messages for fields if you need them (@Html.ValidationMessage)
  </fieldset>
</form>

取决于您的需要,并将这些dimens.xml文件放入这些文件夹中。

答案 2 :(得分:0)

由于PercentRelativeLayout是一个很好的选择,因为@ rafsanahmad007说,但是如果你想使用与weight_sum相同的布局,你需要一个小的修改,就像这样

<LinearLayout
 android_orientation:vertical> //parent layout

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

  //this will have two further layout, left include image and text, right for other views and total weightSum for both
  <LinearLayout
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:orientation="horizontal"
      android:weightSum="your_desired_weight_sum">

      <LayoutLeft>
      add any layout with layout weight 
      </LayoutLeft> 

      <LayoutRight>
      add any layout with layout weight 
      </LayoutRight> 
   <LinearLayout>

</LinearLayout>

因为粗略的层次结构给你全部的想法,请原谅我,如果不能得到:)

相关问题