2017-07-02 12 views
0

私はしばらくの間、ConstraintLayoutを使用してきましたが、これまでのところ好きではありましたが、レイアウトの調整の問題にぶつかりました。 enter image description hereConstraintLayoutの2つのビューの下にTextViewを配置するにはどうすればよいですか?

あなたはTextViewテキスト要求された時間が、私はこのビューが常にLinearLayout(それ上にある)の下に位置合わせすることを望ん持つだけでなく、評価の下に以下を参照してくださいここで私が持っているものです右側のバー。そのために、上のアンカーポイントをLinearLayoutに固定しましたが、右の定格バーの下に位置するように制約することはできません。エッジごとに1つの制約しか置くことはできません。

LinearLayoutの高さが常に(画像表示+評価バー)の高さよりも大きいか、またはそれ以下であると仮定することはできません。

<?xml version="1.0" encoding="utf-8"?> 
<android.support.constraint.ConstraintLayout 
    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:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_marginTop="4dp" 
    android:layout_marginBottom="4dp" 
    android:layout_marginLeft="8dp" 
    android:layout_marginStart="8dp" 
    android:layout_marginRight="8dp" 
    android:layout_marginEnd="8dp" 
    android:background="@color/lightGrey" 
    android:id="@+id/constraintLayout"> 


    <LinearLayout 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:orientation="vertical" 
     app:layout_constraintTop_toTopOf="parent" 
     android:layout_marginLeft="16dp" 
     android:layout_marginStart="16dp" 
     android:layout_marginTop="16dp" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toLeftOf="@+id/guideline" 
     android:layout_marginRight="8dp" 
     android:layout_marginEnd="8dp" 
     app:layout_constraintHorizontal_bias="0.0" 
     android:id="@+id/linearLayout" 
     tools:layout_editor_absoluteY="16dp"> 

     <TextView 
      android:text="@string/tutor_name" 
      android:textStyle="bold" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:id="@+id/tutor_name"/> 

     <TextView 
      android:text="@string/tutor_skill_set" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="12dp" 
      android:id="@+id/skill_set"/> 

     <TextView 
      android:text="@string/tutor_types" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="12dp" 
      android:id="@+id/tutor_types" /> 

     <TextView 
      android:text="@string/tutor_location" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:id="@+id/location" 
      android:layout_marginTop="12dp" /> 

    </LinearLayout> 


    <ImageView 
     android:id="@+id/display_pic" 
     android:layout_width="80dp" 
     android:layout_height="80dp" 
     android:layout_alignParentEnd="true" 
     android:layout_alignParentRight="true" 
     android:layout_marginEnd="16dp" 
     android:layout_marginLeft="8dp" 
     android:layout_marginRight="16dp" 
     android:layout_marginStart="8dp" 
     android:layout_marginTop="16dp" 
     android:adjustViewBounds="false" 
     android:scaleType="centerCrop" 
     app:layout_constraintHorizontal_bias="1.0" 
     app:layout_constraintLeft_toLeftOf="@+id/guideline" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toTopOf="parent" 
     app:srcCompat="@android:color/holo_red_light" /> 

    <com.iarcuschin.simpleratingbar.SimpleRatingBar 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:id="@+id/tutor_rating" 
     android:layout_below="@+id/display_pic" 
     android:layout_alignParentRight="true" 
     android:layout_alignParentEnd="true" 
     app:srb_starSize="13dp" 
     app:srb_numberOfStars="5" 
     app:srb_borderColor="@color/colorAccent" 
     app:srb_fillColor="@color/colorPrimary" 
     app:srb_starBorderWidth="1" 
     app:srb_isIndicator="true" 
     app:layout_constraintRight_toRightOf="@+id/display_pic" 
     android:layout_marginTop="8dp" 
     app:layout_constraintTop_toBottomOf="@+id/display_pic" 
     android:layout_marginLeft="8dp" 
     android:layout_marginStart="8dp" 
     app:layout_constraintLeft_toLeftOf="@+id/guideline" 
     app:layout_constraintHorizontal_bias="1.0" /> 

    <android.support.constraint.Guideline 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:id="@+id/guideline" 
     android:orientation="vertical" 
     app:layout_constraintGuide_percent="0.6796875" /> 

    <TextView 
     android:id="@+id/tutor_requested_time" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="Requested time" 
     android:textStyle="italic" 
     android:layout_marginStart="32dp" 
     android:layout_marginLeft="32dp" 
     tools:layout_editor_absoluteX="30dp" 
     android:layout_marginTop="47dp" 
     app:layout_constraintTop_toBottomOf="@+id/linearLayout" /> 


</android.support.constraint.ConstraintLayout> 

:そのため、より多くの2の深さにあるビューは、あなたの参考のために要求された時間TextView

の究極的な位置の決定、ここでは上記のレイアウトファイルでなければなりません

私が試したとが(ではないが、本当に)を働いた半ソリューションは:

<?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:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_marginTop="4dp" 
    android:layout_marginBottom="4dp" 
    android:layout_marginLeft="8dp" 
    android:layout_marginStart="8dp" 
    android:layout_marginRight="8dp" 
    android:layout_marginEnd="8dp" 
    android:background="@color/lightGrey"> 


    <android.support.constraint.ConstraintLayout 
     android:orientation="vertical" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_marginBottom="10dp" 
     android:paddingBottom="10dp" 
     android:elevation="2dp" 
     android:id="@+id/constraintLayout"> 


     <LinearLayout 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:orientation="vertical" 
      app:layout_constraintTop_toTopOf="parent" 
      android:layout_marginLeft="16dp" 
      android:layout_marginStart="16dp" 
      android:layout_marginTop="16dp" 
      app:layout_constraintLeft_toLeftOf="parent" 
      app:layout_constraintRight_toLeftOf="@+id/guideline" 
      android:layout_marginRight="8dp" 
      android:layout_marginEnd="8dp" 
      app:layout_constraintHorizontal_bias="0.0" 
      android:id="@+id/linearLayout" 
      tools:layout_editor_absoluteY="16dp"> 

      <TextView 
       android:text="@string/tutor_name" 
       android:textStyle="bold" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:id="@+id/tutor_name"/> 

      <TextView 
       android:text="@string/tutor_skill_set" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:layout_marginTop="12dp" 
       android:id="@+id/skill_set"/> 

      <TextView 
       android:text="@string/tutor_types" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:layout_marginTop="12dp" 
       android:id="@+id/tutor_types" /> 

      <TextView 
       android:text="@string/tutor_location" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:id="@+id/location" 
       android:layout_marginTop="12dp" /> 

     </LinearLayout> 


     <ImageView 
      android:id="@+id/display_pic" 
      android:layout_width="80dp" 
      android:layout_height="80dp" 
      android:layout_alignParentEnd="true" 
      android:layout_alignParentRight="true" 
      android:layout_marginEnd="16dp" 
      android:layout_marginLeft="8dp" 
      android:layout_marginRight="16dp" 
      android:layout_marginStart="8dp" 
      android:layout_marginTop="16dp" 
      android:adjustViewBounds="false" 
      android:scaleType="centerCrop" 
      app:layout_constraintHorizontal_bias="1.0" 
      app:layout_constraintLeft_toLeftOf="@+id/guideline" 
      app:layout_constraintRight_toRightOf="parent" 
      app:layout_constraintTop_toTopOf="parent" 
      app:srcCompat="@android:color/holo_red_light" /> 

     <com.iarcuschin.simpleratingbar.SimpleRatingBar 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/tutor_rating" 
      android:layout_below="@+id/display_pic" 
      android:layout_alignParentRight="true" 
      android:layout_alignParentEnd="true" 
      app:srb_starSize="13dp" 
      app:srb_numberOfStars="5" 
      app:srb_borderColor="@color/colorAccent" 
      app:srb_fillColor="@color/colorPrimary" 
      app:srb_starBorderWidth="1" 
      app:srb_isIndicator="true" 
      app:layout_constraintRight_toRightOf="@+id/display_pic" 
      android:layout_marginTop="8dp" 
      app:layout_constraintTop_toBottomOf="@+id/display_pic" 
      android:layout_marginLeft="8dp" 
      android:layout_marginStart="8dp" 
      app:layout_constraintLeft_toLeftOf="@+id/guideline" 
      app:layout_constraintHorizontal_bias="1.0" /> 

     <android.support.constraint.Guideline 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/guideline" 
      android:orientation="vertical" 
      app:layout_constraintGuide_percent="0.6796875" /> 


    </android.support.constraint.ConstraintLayout> 


    <TextView 
     android:id="@+id/tutor_requested_time" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginLeft="32dp" 
     android:text="Requested time" 
     android:textStyle="italic" 
     android:layout_marginStart="32dp" 
     android:layout_marginBottom="8dp" 
     android:layout_below="@+id/constraintLayout" /> 


</RelativeLayout> 

ノーの答えとはまだ別の質問投稿れる独自の問題があるこのソリューション:だから、それはまた一種のConstraintLayout自体を使用しての目的に反し、Color of TextView shows as white on a real device with ConstraintLayout

をそして...

は、ん誰もが知っている/上記の問題のためのソリューション/アイデアを持っている?

+0

なぜ、あなたの 'LinearLayout'と' RatingBar'の両方の親として別の制約レイアウトを追加しませんか? –

+0

@KingfisherPhuoc:私はそのようなことをしました。それが私の半解決策です。それには独自の問題があります。あなたがそれらに答えることができるならリンクされた質問を見てください。 –

+0

これに関する素晴らしいチュートリアルがあります:https://constraintlayout.com/basics/barriers.html。興味のあるビューは「バリア」です:https://developer.android.com/reference/android/support/constraint/Barrier.html –

答えて

0

ConstraintLayoutの新機能は、Barrierと呼ばれます。 this accepted answerバリアを持つConstraintLayout、サイズに応じてバリアのボトム/トップに制約する方法を参照してください。

+0

はい、それを使用しました。どうも。他にも大きな問題があります:https://stackoverflow.com/questions/44847361/color-of-textview-shows-as-white-on-a-real-device-with-constraintlayout –

関連する問題