Babbara
Reputation: 488
Place elements under others in Linear Layout inside Constraint Layout
I'm trying to place a set of elements in a column, inside my LinearLayout. The problem is that it doesn't recognize instruction like "layout_below" (it says it is invalide): This is the result:
The result I'm expecting is the first TextView and Spinner on the first line, The "Release" TextView and the EditText on the second line and the other three elements on the third line. This is the code:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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:id="@+id/linearLayout2"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/textView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="49dp"
android:layout_marginLeft="49dp"
android:layout_marginEnd="49dp"
android:layout_marginRight="49dp"
android:text="Search"
android:textColor="#ffffff"
android:textSize="@dimen/_20ssp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<EditText
android:id="@+id/search_field"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="1dp"
android:layout_marginTop="12dp"
android:layout_marginEnd="20dp"
android:background="@drawable/search_layout"
android:ems="10"
android:fontFamily="@font/nunito_bold"
android:hint="Search here"
android:inputType="textPersonName"
android:paddingLeft="20dp"
android:paddingTop="10dp"
android:paddingRight="20dp"
android:paddingBottom="10dp"
android:textColor="@color/colorPrimary"
android:textColorHint="@color/colorPrimary"
android:textSize="16sp"
app:layout_constraintEnd_toStartOf="@id/search_btn"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintStart_toStartOf="@id/textView2"
app:layout_constraintTop_toBottomOf="@+id/textView2" />
<ImageButton
android:id="@+id/search_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:background="@color/cardview_shadow_end_color"
android:paddingTop="17dp"
app:layout_constraintBottom_toTopOf="@id/checkbox_adv"
app:layout_constraintEnd_toEndOf="@id/textView2"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintStart_toEndOf="@+id/search_field"
app:layout_constraintTop_toBottomOf="@+id/textView2"
app:srcCompat="@mipmap/search_button" />
<CheckBox
android:id="@+id/checkbox_adv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Advanced search"
android:layout_marginEnd="@dimen/_30sdp"
android:textColor="@color/colorPrimary"
app:layout_constraintBottom_toTopOf="@id/hiddenTab"
app:layout_constraintEnd_toEndOf="@+id/search_btn"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintStart_toStartOf="@+id/search_field"
app:layout_constraintTop_toBottomOf="@+id/search_field" />
<LinearLayout
android:id="@+id/hiddenTab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:visibility="gone"
android:layout_marginTop="@dimen/_7sdp"
app:layout_constraintBottom_toTopOf="@id/popular_rc_view"
app:layout_constraintEnd_toEndOf="@id/search_btn"
app:layout_constraintStart_toStartOf="@id/search_field"
app:layout_constraintTop_toBottomOf="@+id/checkbox_adv"
tools:visibility="visible">
<!-- LINE 1 -->
<TextView
android:id="@+id/textGenre"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Genre:"
android:textColor="@color/colorPrimary"
android:textAlignment="gravity" />
<Spinner
android:id="@+id/spinnerGenre"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/spinner"
android:layout_margin="10dp"
android:textColor="@color/colorPrimary"
android:entries="@array/genre_list" />
<!-- END OF LINE 1 -->
<!-- LINE 2 -->
<TextView
android:id="@+id/textYear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Release:"
android:layout_below="@+id/genresTextView"
android:textColor="@color/colorPrimary"
android:textAlignment="gravity" />
<EditText
android:id="@+id/releaseYear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/spinner"
android:layout_margin="10dp"
android:textColor="@color/colorPrimary" />
<!-- END OF LINE 2 -->
<!-- LINE 3 -->
<TextView
android:id="@+id/textVote"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Rating:"
android:layout_below="@+id/genresTextView"
android:textColor="@color/colorPrimary"
android:textAlignment="gravity" />
<Spinner
android:id="@+id/spinnerOperator"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/spinner"
android:layout_margin="10dp"
android:textColor="@color/colorPrimary"
android:entries="@array/operator_list" />
<Spinner
android:id="@+id/spinnerVote"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/spinner"
android:layout_margin="10dp"
android:textColor="@color/colorPrimary"
android:entries="@array/vote_list" />
<!-- END OF LINE 3 -->
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/popular_rc_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="20dp"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/hiddenTab" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fab3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"
android:scaleType="center"
android:src="@drawable/recent_icon"
android:text="Most Recent"
android:visibility="invisible"
app:backgroundTint="@color/design_default_color_on_primary"
app:elevation="6dp"
app:layout_constraintBottom_toTopOf="@+id/fab2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1"
app:maxImageSize="35dp"
app:pressedTranslationZ="12dp" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fab2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="18dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"
android:scaleType="center"
android:src="@drawable/rated_icon"
android:text="Most Rated"
android:visibility="invisible"
app:backgroundTint="@color/design_default_color_background"
app:elevation="6dp"
app:layout_constraintBottom_toTopOf="@+id/fab1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1"
app:maxImageSize="35dp"
app:pressedTranslationZ="12dp" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:scaleType="center"
android:src="@drawable/pop_icon"
android:text="Most Popular"
android:visibility="invisible"
app:backgroundTint="@color/design_default_color_background"
app:elevation="6dp"
app:layout_constraintBottom_toTopOf="@+id/fab"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1"
app:maxImageSize="35dp"
app:pressedTranslationZ="12dp" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_marginBottom="20dp"
android:scaleType="centerInside"
android:src="@drawable/filter"
app:backgroundTint="@color/colorPrimary"
app:elevation="6dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1"
app:maxImageSize="35dp"
app:pressedTranslationZ="12dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
Upvotes: 0
Views: 839
Answers (1)
Giorgio Antonioli
Reputation: 16214
The attribute android:layout_below isn't recognized because it's an attribute of RelativeLayout, LinearLayout hasn't that kind of attribute.
To obtain your desired behavior, LinearLayout isn't the right ViewGroup for you since it allows only to stack subviews horizontally or vertically, not to mix an horizontal arrangement and a vertical one.
You should use ConstraintLayout (better) or RelativeLayout (worse) to obtain that behavior.
Furthermore, since your parent is already a ConstraintLayout you don't need the nested ViewGroup hiddenTab to arrange the views in that position. If hiddenTab was simply added to control its visibility, remember that you can use the ContraintLayout's Group to control it.
Upvotes: 1
Related Questions
- Android ConstraintLayout - Put one view on top of another view
- How to place view on top of another using constraint layout?
- Android constraint layout positioning 1 item below other
- How to overlap elements in a ConstraintLayout in android?
- How to place elements one below another in constraint layout whose parent is scroll view
- How to align a Linear Layout in a Constraint Layout
- XML constraint layout: Elements placed on top of each other, fix?
- Place View under another View within ConstraintLayout
- How to position view in this ConstraintLayout
- Overlay of the elements in ConstraintLayout