I am having an issue with designing Android Studio Layout for App. In linear layout, I want to add first two layouts in the first column horizontally and then in the next column, I wish to add that three buttons in horizontally and finally in the last column want to add Listview. Any help would be highly appreciated. As currently, everything falls into one row.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<james.view.VideoView
android:id="#+id/remoteVideoView"
android:layout_width="120dp"
android:layout_height="90dp"
/>
<james.view.VideoView
android:id="#+id/localVideoView"
android:layout_width="120dp"
android:layout_height="90dp"
/>
<Button
android:id="#+id/startVideoButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Start Call"
/>
<Button
android:id="#+id/stopVideoButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="End Call"
/>
<Button
android:id="#+id/sendmessage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="msg"
/>
<ListView
android:id="#+id/errorList"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</ListView>
</LinearLayout>
</android.support.constraint.ConstraintLayou
This is how I want my layout to be
If you don't understand Constraints. You can use regular LinearLayout.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="10dp"
tools:context=".MainActivity"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="90dp"
>
<james.view.VideoView
android:id="#+id/remoteVideoView"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
/>
<james.view.VideoView
android:id="#+id/localVideoView"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="10dp"
android:layout_weight="1"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
>
<Button
android:id="#+id/startVideoButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Start Call"/>
<Button
android:id="#+id/stopVideoButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="End Call"/>
<Button
android:id="#+id/sendmessage"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="msg"/>
</LinearLayout>
<ListView
android:id="#+id/errorList"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="10dp"
android:layout_weight="1"
>
</ListView>
</LinearLayout>
Quite simple!
Solution:
This is exactly how you want, Just copy paste and your job is done:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<james.view.VideoView
android:id="#+id/remoteVideoView"
android:layout_width="120dp"
android:layout_height="90dp"
android:layout_marginBottom="8dp"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/localVideoView"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<james.view.VideoView
android:id="#+id/localVideoView"
android:layout_width="120dp"
android:layout_height="90dp"
android:layout_marginBottom="8dp"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/remoteVideoView"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<LinearLayout
android:id="#+id/linearLayout3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/linearLayout2">
<Button
android:id="#+id/startVideoButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Start Call" />
<Button
android:id="#+id/stopVideoButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="End Call" />
<Button
android:id="#+id/sendmessage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="msg" />
</LinearLayout>
<ListView
android:id="#+id/errorList"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/linearLayout3">
</ListView>
</android.support.constraint.ConstraintLayout>
Try it. Hope it helps.
This is a sample xml, similar to your image. Since your code uses constraintLayout I have created the xml using constraintLayout instead of linear layout. I have created this from the design screen and not from the text screen. This is the xml `
<?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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="49dp"
android:layout_marginStart="49dp"
android:layout_marginTop="32dp"
android:text="Button"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="67dp"
android:layout_marginRight="67dp"
android:layout_marginTop="32dp"
android:text="Button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="193dp"
android:text="Button"
app:layout_constraintEnd_toEndOf="#+id/button"
app:layout_constraintStart_toStartOf="#+id/button"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="29dp"
android:layout_marginStart="29dp"
android:text="Button"
app:layout_constraintBaseline_toBaselineOf="#+id/button3"
app:layout_constraintStart_toEndOf="#+id/button3" />
<Button
android:id="#+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="35dp"
android:layout_marginEnd="17dp"
android:layout_marginRight="17dp"
android:layout_marginTop="193dp"
android:text="Button"
app:layout_constraintBottom_toTopOf="#+id/recyclerView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="19dp"
android:layout_marginEnd="22dp"
android:layout_marginLeft="22dp"
android:layout_marginRight="22dp"
android:layout_marginStart="22dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/button5" />
</android.support.constraint.ConstraintLayout>
`
Please see if this helps you. This is not exact screen as per your requirements.
Related
I making a question app the questions page should be scrolling up when a question have an answer . How can I make this .e.g I want when an question have answer 100px scrolling up . How can I make thnks
`
<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="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" tools:context=".Screens.GamePlayFragment">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/gameplay_background"
android:orientation="vertical" >
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageView5"
android:layout_width="match_parent"
android:layout_height="120dp"
android:layout_marginTop="-5dp"
android:layout_marginBottom="-5dp"
android:src="#drawable/gameapptop"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="120dp"
android:layout_height="70dp"
android:layout_marginTop="-15dp"
android:src="#drawable/placeofcountdown_game_screen"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageViewCounterIcon"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_marginTop="5dp"
android:paddingBottom="30dp"
android:layout_marginLeft="5dp"
android:src="#drawable/gameovercountericon"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Chronometer
android:id="#+id/textViewCounter"
android:layout_width="wrap_content"
android:layout_height="55dp"
android:layout_marginTop="5dp"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintStart_toEndOf="#+id/imageViewCounterIcon"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:layout_marginRight="10dp"
android:text="2/17"
android:textColor="#color/white"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<ScrollView
android:layout_width="match_parent"
android:id="#+id/linearLayoutGame"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="0dp"
>
<!--Question 1 -->
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageView9"
android:layout_width="400dp"
android:layout_height="220dp"
android:layout_marginTop="-2dp"
android:src="#drawable/placeofquestion3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/questionLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#+id/qRoof1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/q1"
android:layout_width="270dp"
android:layout_height="120dp"
android:src="#drawable/q1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
`
How can I make this .e.g I want when an question have answer 100px scrolling up . How can I make thnks
I'm making a soundbox for me and my friends in android studio.
I've got a simple Scroll view, that I filled up with multiple constraintLayout that each contains 2 imageView with each of having a line of text under it.
The problem is that when I run the app, I only see the 2 first layouts, i've no idea what's going on and this is probably not the good way to do it.
What's the best solution here? Here is the xml code :
<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/linearLayout"
android:layout_width="match_parent"
android:layout_height="800dp"
android:background="#353535"
tools:context=".MainActivity">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:id="#+id/buttonStopAll"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/red_perso"
android:text="Stop tout"
android:textColor="#000000" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="200dp">
<ImageView
android:id="#+id/idTheoGonfle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/theosouffle" />
<ImageView
android:id="#+id/idChuteCJ"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/cjchute" />
<TextView
android:id="#+id/textTheoGonfle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:width="150dp"
android:background="#FFEB3B"
android:fontFamily="sans-serif-black"
android:gravity="center"
android:text="Théo gonfle"
android:textAllCaps="false"
android:textColor="#000000"
android:textSize="16sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/idTheoGonfle" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:width="150dp"
android:background="#FFEB3B"
android:fontFamily="sans-serif-black"
android:text="TextView"
android:textAlignment="center"
android:textColor="#000000"
android:textSize="16sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/idChuteCJ" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout4"
android:layout_width="match_parent"
android:layout_height="200dp">
<ImageView
android:id="#+id/imageView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_launcher_foreground" />
<ImageView
android:id="#+id/imageView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_launcher_foreground" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout3"
android:layout_width="match_parent"
android:layout_height="200dp">
<ImageView
android:id="#+id/imageView9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:srcCompat="#tools:sample/avatars" />
<ImageView
android:id="#+id/imageView10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:srcCompat="#tools:sample/avatars" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout2"
android:layout_width="match_parent"
android:layout_height="200dp">
<ImageView
android:id="#+id/imageView11"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:srcCompat="#tools:sample/avatars" />
<ImageView
android:id="#+id/imageView12"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:srcCompat="#tools:sample/avatars" />
</androidx.constraintlayout.widget.ConstraintLayout>
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>```
look like you are begginer.
<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/linearLayout"
android:layout_width="match_parent"
android:layout_height="800dp"
android:background="#353535"
tools:context=".MainActivity">
look like your problem
android:layout_height="800dp"
You set the fix height. Change it to match_parent.
<androidx.constraintlayout.widget.ConstraintLayout. And change root layout to FrameLayout or remove it.
I have a problem. Everything just looks compressed but my design layout in my IDE is normal as is. What could be the problem?
First pic: The output of the app. Everything is compressed. I have no idea what happened
Second pic: Everything seems normal
This is my XML Code:
<?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:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
tools:showIn="#layout/activity_main">
<android.support.constraint.ConstraintLayout
android:layout_width="395dp"
android:layout_height="659dp"
tools:ignore="MissingConstraints"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="8dp">
<Button
android:id="#+id/btn_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/btn_text"
tools:layout_editor_absoluteX="16dp"
tools:layout_editor_absoluteY="131dp" />
<Button
android:id="#+id/btn_txt_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableStart="#android:drawable/ic_dialog_email"
android:text="#string/btn_txt_image"
tools:layout_editor_absoluteX="117dp"
tools:layout_editor_absoluteY="131dp" />
<ImageButton
android:id="#+id/ibtn_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="TODO"
android:onClick="doImageButton"
app:srcCompat="#android:drawable/ic_menu_camera"
tools:layout_editor_absoluteX="237dp"
tools:layout_editor_absoluteY="128dp" />
<CheckBox
android:id="#+id/cbx_fruit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/cbx_fruit"
tools:layout_editor_absoluteX="34dp"
tools:layout_editor_absoluteY="221dp" />
<CheckBox
android:id="#+id/cbx_meat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/cbx_meat"
tools:layout_editor_absoluteX="135dp"
tools:layout_editor_absoluteY="221dp" />
<RadioGroup
android:id="#+id/rgrp_level"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:layout_editor_absoluteX="34dp"
tools:layout_editor_absoluteY="283dp">
<RadioButton
android:id="#+id/rbtn_one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/rbtn_one" />
<RadioButton
android:id="#+id/rbtn_two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/rbtn_two" />
<RadioButton
android:id="#+id/rbtn_three"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/rbtn_three" />
</RadioGroup>
<RatingBar
android:id="#+id/rbar_star"
android:layout_width="435dp"
android:layout_height="116dp"
tools:layout_editor_absoluteX="-37dp"
tools:layout_editor_absoluteY="454dp" />
<EditText
android:id="#+id/etxt_msg"
android:layout_width="251dp"
android:layout_height="55dp"
android:ems="10"
android:inputType="textPersonName"
android:text="#string/etxt_msg"
tools:layout_editor_absoluteX="16dp"
tools:layout_editor_absoluteY="606dp" />
<Button
android:id="#+id/btn_toast"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/btn_toast"
tools:layout_editor_absoluteX="293dp"
tools:layout_editor_absoluteY="612dp" />
<ToggleButton
android:id="#+id/tbtn_power"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/tbtn_power"
tools:layout_editor_absoluteX="279dp"
tools:layout_editor_absoluteY="312dp" />
</android.support.constraint.ConstraintLayout>
You need to add constraints to your layout views, heres an example:
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/constraintlayout_intro"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorPrimaryDark"
android:paddingLeft="#dimen/spacing_normal"
android:paddingRight="#dimen/spacing_normal">
<br.com.informant.cegonheira.ui.component.CustomViewPager
android:id="#+id/viewpager_intro"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.appcompat.widget.AppCompatButton
android:id="#+id/btn_intro"
android:layout_width="200dp"
android:layout_marginTop="360dp"
android:layout_height="#dimen/spacing_big"
android:background="#drawable/background_rounded_green_gradient_button"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<me.relex.circleindicator.CircleIndicator
android:id="#+id/circle_indicator_intro"
android:layout_width="match_parent"
android:layout_height="#dimen/spacing_normal"
android:layout_marginTop="460dp"
app:ci_drawable="#drawable/ic_radio_white"
app:ci_drawable_unselected="#drawable/ic_radio_grey"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Notice this in the last view(CircleIndicator):
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
This is what tells where the view is going to be "anchored", otherwise they just "float" like happened to yours.
You can read more about it here: Build a Responsive UI with ConstraintLayout
Congratulations for your first app!
I have a RecyclerView with a ViewPager inside it, which in turn have another recyclerView. The recyclerView inside a ViewPager don't load whole items, but only one, and don't scroll to show the rest of the items
I have tried to set the layout_height of the two recycler view with wrap_content, and also nested it inside a nestedSCrollView, without success.
// First outside recyclerview
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
// cell item with viewPager
<com.google.android.material.tabs.TabLayout
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="50dp" />
<androidx.viewpager.widget.ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
// recyclerView inside viewPager
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
I expect that the outside recyclerView fill the whole height of the items, instead the recycler view inside seams that don't load the whole items but the only one that is visible in the screen, without scroll.
EDIT
fragment__events_detail (layout)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:layout_marginBottom="#dimen/toolbar__height"
tools:layout_marginTop="#dimen/actionbar__height">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
The first cell of the recycler view
<?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/mainContainer"
android:layout_width="match_parent"
android:layout_height="300dp"
android:orientation="vertical">
<!-- img video club -->
<ImageView
android:id="#+id/imgVideoClub"
android:layout_width="0dp"
android:layout_height="300dp"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:srcCompat="#tools:sample/avatars[12]" />
<!-- play icon -->
<ImageView
android:id="#+id/playIcon"
android:layout_width="60dp"
android:layout_height="60dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/play_icon" />
<LinearLayout
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_marginTop="8dp"
android:layout_marginRight="8dp"
android:background="#drawable/btn_rounded_orange_outline_red_bg"
android:orientation="vertical"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/imageView8"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_gravity="center"
android:layout_marginTop="8dp"
app:srcCompat="#drawable/prohibition_icon" />
<TextView
android:text="Segnala abuso"
android:textColor="#fff"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
The second cell with a tablayout and a viewpager
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.google.android.material.tabs.TabLayout
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="50dp" />
<androidx.viewpager.widget.ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
The fragment inside first tab of the viewPager with a recyclerView inside
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="match_parent"
android:orientation="vertical"
tools:layout_marginBottom="#dimen/toolbar__height"
tools:layout_marginTop="#dimen/actionbar__height">
<!-- header -->
<TextView
android:text="Eventi"
style="#style/header_txtStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<!-- separator -->
<View
android:background="#color/separator_background"
android:layout_width="wrap_content"
android:layout_height="1dp"/>
<!-- container events search -->
<LinearLayout
android:orientation="horizontal"
android:paddingLeft="#dimen/main__horizzontalPadding"
android:paddingRight="#dimen/main__horizzontalPadding"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- search icon -->
<ImageView
android:src="#drawable/search_icon"
android:layout_width="20dp"
android:layout_height="30dp" />
<EditText
android:id="#+id/events__home_eventsSearchEditTxt"
android:background="#android:color/transparent"
android:layout_marginLeft="16dp"
android:hint="Cerca eventi"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<!-- separator -->
<View
android:background="#color/separator_background"
android:layout_width="wrap_content"
android:layout_height="3dp"/>
<!-- range time events -->
<androidx.constraintlayout.widget.ConstraintLayout
android:paddingLeft="#dimen/main__horizzontalPadding"
android:paddingRight="#dimen/main__horizzontalPadding"
android:layout_width="match_parent"
android:layout_height="50dp">
<TextView
android:id="#+id/events__home_thisWeekTimeTxt"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Questa settimana"
android:textColor="#color/events__home_itemNotSelected"
android:gravity="center"
android:textSize="#dimen/events__home_rangeTimeTxtSize"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/events__home_nextWeekTimeTxt"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Prossima settimana"
android:textColor="#color/events__home_itemNotSelected"
android:textSize="#dimen/events__home_rangeTimeTxtSize"
android:gravity="center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toLeftOf="#id/events__home_calendarRangeTimeContainer"
app:layout_constraintLeft_toRightOf="#id/events__home_thisWeekTimeTxt"
app:layout_constraintTop_toTopOf="parent" />
<LinearLayout
android:id="#+id/events__home_calendarRangeTimeContainer"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="match_parent">
<TextView
android:id="#+id/events__home_calendarRangeTimeTxt"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:textSize="#dimen/events__home_rangeTimeTxtSize"
android:textColor="#color/events__home_itemNotSelected"
android:gravity="center" />
<ImageButton
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_gravity="center"
android:background="#android:color/transparent"
android:padding="5dp"
android:scaleType="centerCrop"
android:src="#drawable/calendar__icon" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
The items of the second recyclerView
<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/row__events_home_container"
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_marginLeft="20dp"
android:layout_marginTop="10dp"
android:layout_marginRight="20dp"
android:layout_marginBottom="10dp"
android:background="#drawable/event__background_rounded"
android:padding="20dp">
<ImageView
android:id="#+id/calendarIcon"
android:layout_width="0dp"
android:layout_height="30dp"
android:layout_marginBottom="16dp"
android:scaleType="fitCenter"
app:layout_constraintBottom_toTopOf="#+id/clockIcon"
app:layout_constraintEnd_toEndOf="#+id/clockIcon"
app:layout_constraintStart_toStartOf="#+id/clockIcon"
app:srcCompat="#drawable/calendar__icon" />
<TextView
android:id="#+id/row__events_home_dateEvent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:text="TextView"
android:textColor="#color/events__home_secondaryTextColor"
app:layout_constraintBottom_toBottomOf="#+id/calendarIcon"
app:layout_constraintStart_toEndOf="#+id/calendarIcon"
app:layout_constraintTop_toTopOf="#+id/calendarIcon" />
<TextView
android:id="#+id/row__events_home_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textSize="18sp"
android:textStyle="bold"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/row__events_home_category"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textColor="#color/colorPrimary"
app:layout_constraintStart_toStartOf="#+id/row__events_home_title"
app:layout_constraintTop_toBottomOf="#+id/row__events_home_title" />
<ImageView
android:id="#+id/locationIcon"
android:layout_width="0dp"
android:layout_height="30dp"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:srcCompat="#drawable/location__icon" />
<TextView
android:id="#+id/row__events_home_locationEventName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:text="TextView"
android:textColor="#color/events__home_secondaryTextColor"
app:layout_constraintBottom_toBottomOf="#+id/locationIcon"
app:layout_constraintStart_toEndOf="#+id/locationIcon"
app:layout_constraintTop_toTopOf="#+id/locationIcon" />
<ImageView
android:id="#+id/clockIcon"
android:layout_width="0dp"
android:layout_height="30dp"
android:layout_marginBottom="16dp"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
app:layout_constraintBottom_toTopOf="#+id/locationIcon"
app:layout_constraintEnd_toEndOf="#+id/locationIcon"
app:layout_constraintStart_toStartOf="#+id/locationIcon"
app:srcCompat="#drawable/clock__icon" />
<TextView
android:id="#+id/row__events_home_timeEvent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:text="TextView"
android:textColor="#color/events__home_secondaryTextColor"
app:layout_constraintBottom_toBottomOf="#+id/clockIcon"
app:layout_constraintStart_toEndOf="#+id/clockIcon"
app:layout_constraintTop_toTopOf="#+id/clockIcon" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/row__events_home_interestBtn"
android:layout_width="130dp"
android:layout_height="30dp"
android:background="#drawable/btn_rounded_orange_outline"
android:paddingLeft="10dp"
android:paddingRight="20dp"
app:layout_constraintBottom_toBottomOf="#+id/clockIcon"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="#+id/clockIcon">
<ImageView
android:id="#+id/imageView10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/interest__events_icon" />
<TextView
android:id="#+id/textView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Mi interessa"
android:textColor="#color/colorPrimary"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/row__events_home_buyBtn"
android:layout_width="130dp"
android:layout_height="30dp"
android:background="#drawable/btn_rounded_orange_outline"
android:paddingLeft="10dp"
android:paddingRight="20dp"
app:layout_constraintBottom_toBottomOf="#+id/locationIcon"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="#+id/locationIcon">
<TextView
android:id="#+id/textView9"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Prenota"
android:textColor="#color/colorPrimary"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/imageView11"
app:layout_constraintTop_toTopOf="parent"
tools:text="Prenota" />
<ImageView
android:id="#+id/imageView11"
android:layout_width="20dp"
android:layout_height="20dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ticket__events_buy" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
I went through different solutions from stackoverflow and web, but didn't work. the scrollbar of listView is very tiny, I want it to be large enough. I used android:scrollbarSize="55dip" but it didn't work, android ignores it.
activity_main.xml :
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".MainActivity">
<RadioGroup
android:id="#+id/radioGroup"
android:layout_width="368dp"
android:layout_height="47dp"
android:layout_gravity="end"
android:layout_marginStart="8dp"
android:layout_marginTop="32dp"
android:orientation="horizontal"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/editText">
<RadioButton
android:id="#+id/azadRadio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_weight="1"
android:gravity="right"
android:layoutDirection="rtl"
android:text="آزاد"
android:textSize="30sp" />
<RadioButton
android:id="#+id/qafiaRadio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_weight="1"
android:gravity="right"
android:layoutDirection="rtl"
android:text="قافیہ"
android:textSize="30sp" />
<RadioButton
android:id="#+id/sabiqaRadio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_weight="1"
android:gravity="right"
android:layoutDirection="rtl"
android:text="سابقہ"
android:textSize="30sp" />
</RadioGroup>
<EditText
android:id="#+id/editText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="36dp"
android:layout_marginTop="36dp"
android:ems="10"
android:inputType="text"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:layout_marginTop="36dp"
android:layout_marginEnd="8dp"
android:onClick="Finder"
android:text="Finder"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.555"
app:layout_constraintStart_toEndOf="#+id/editText"
app:layout_constraintTop_toTopOf="parent" />
<ListView
android:id="#+id/listView"
android:layout_width="359dp"
android:layout_height="0dp"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="44dp"
android:scrollbars="vertical"
android:verticalScrollbarPosition="left"
android:scrollbarSize="55dip"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/radioGroup" />
</android.support.constraint.ConstraintLayout>
custom.xml :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/textView"
android:paddingRight="40dp"
android:scrollbarSize="55dip"
android:textSize="20px" android:paddingTop="10dip" android:paddingBottom="10dip"/>
</LinearLayout>
Use this line too with the scrollsize you used:
android:scrollbarThumbVertical="#color/colorPrimaryDark"