CODEWITHSUNDEEP
android
Ahsan Abdullah
Ahsan Abdullah

Reputation: 47

How to fit an imageview at the bottom the drawable

I want this result

I am here right now

I want to know that how can i place bottom img at the center of the line. How do I do it? I want that + icon on center of the border of the rectangle.

This is layout code for recycler view and imageview

<RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <FrameLayout
                android:id="@+id/skillsLL"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginStart="@dimen/_15"
                android:layout_marginTop="@dimen/_10"
                android:layout_marginEnd="@dimen/_15"
                android:layout_marginBottom="@dimen/_15"
                android:orientation="vertical">


                <androidx.recyclerview.widget.RecyclerView
                    android:id="@+id/skillsRV"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@drawable/education_outline"
                    android:paddingStart="@dimen/_15"
                    android:paddingEnd="@dimen/_15"
                    android:visibility="visible"

app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
                    app:spanCount="3" />

                <ImageView
                    android:id="@+id/addIMG"
                    android:layout_width="@dimen/_15"
                    android:layout_height="@dimen/_15"
                    android:layout_alignParentBottom="true"
                    android:layout_centerInParent="true"
                    android:layout_gravity="bottom|center"
                    android:adjustViewBounds="true"
                    android:scaleType="fitEnd"
                    android:src="@drawable/ic_more" />

            </FrameLayout>


        </RelativeLayout>

this is my drawable code that is placed behind 

 <?xml version="1.0" encoding="utf-8"?>
 <shape xmlns:android="http://schemas.android.com/apk/res/android">
 <solid android:color="@color/background_color"/>
 <corners android:radius="15dp" />
 <stroke android:width="0.5dp" android:color="@color/black" />
 </shape>

Upvotes: 0

Views: 103

Answers (4)

Dharmaraj
Dharmaraj

Reputation: 50920

I would do this. You don't need to change your Frame Layout to a Constraint Layout using this method. 

<RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <FrameLayout
                android:id="@+id/skillsLL"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginStart="@dimen/_15"
                android:layout_marginTop="@dimen/_10"
                android:layout_marginEnd="@dimen/_15"
                android:layout_marginBottom="@dimen/_15"
                android:orientation="vertical">

            // Keep everything else as it is . . .

            </FrameLayout>

                <ImageView
                    android:id="@+id/addIMG"
                    android:layout_width="20dp"
                    android:layout_height="20dp"
                    android:layout_below="@id/skillsLL"
                    android:adjustViewBounds="true"
                    android:scaleType="fitEnd"
                    android:src="@drawable/ic_more"
                    android:layout_marginTop="-10sp" />

        </RelativeLayout>

Bring that Image view out of frame layout and try my code. Make sure use use dimension as I have use. You can adjust them later.

Basically you are putting he image below the frame layout and then moving the image above by half its height.. Let me know if you need any more assistance in the comments . .

Upvotes: 1

Niraj Wagh
Niraj Wagh

Reputation: 29

Use ConstraintLayout instead of FrameLayout and then constraint your image view's upper and down constraint to the bottom of recycler view.

Constraint the sides of imageview to RecyclerView's sides;

Code for ImageView:

<ImageView
        android:id="@+id/addIMG"
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:layout_alignParentBottom="true"
        android:layout_centerInParent="true"
        android:layout_gravity="bottom|center"
        android:adjustViewBounds="true"
        android:scaleType="fitEnd"
        android:src="@drawable/refresh"
        app:layout_constraintBottom_toBottomOf="@+id/skillsRV"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/skillsRV" />

Upvotes: 0

Juhi Parmar
Juhi Parmar

Reputation: 28

I have implemented this for one of my screen.You can try this.

<RelativeLayout
       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="wrap_content">


                <android.support.constraint.ConstraintLayout
                    android:layout_width="match_parent"
                    android:layout_marginStart="@dimen/_15sdp"
                    android:layout_marginTop="@dimen/_10sdp"
                    android:layout_marginEnd="@dimen/_15sdp"
                    android:layout_marginBottom="@dimen/_15sdp"
                    android:layout_height="wrap_content">

                    <android.support.v7.widget.RecyclerView
                        android:id="@+id/skillsRV"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:background="@drawable/base_bg_rectangle"
                        android:paddingStart="@dimen/_15sdp"
                        android:paddingEnd="@dimen/_15sdp"
                        android:visibility="visible"
                        app:layout_constraintTop_toTopOf="parent"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintEnd_toEndOf="parent"
                        android:layout_marginBottom="@dimen/_7sdp"
                        app:layout_constraintBottom_toBottomOf="parent"
                        app:layoutManager="android.support.v7.widget.GridLayoutManager"
                        app:spanCount="3" />

                    <ImageView
                        android:id="@+id/addIMG"
                        android:layout_width="@dimen/_15sdp"
                        android:layout_height="@dimen/_15sdp"
                        android:layout_centerInParent="true"
                        android:layout_gravity="bottom|center"
                        android:adjustViewBounds="true"
                        app:layout_constraintBottom_toBottomOf="parent"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintEnd_toEndOf="parent"
                        android:scaleType="fitEnd"
                        android:src="@drawable/default_image" />
                </android.support.constraint.ConstraintLayout>


    </RelativeLayout>

Upvotes: 0

SpiritCrusher
SpiritCrusher

Reputation: 21053

Best way to do this is ConstraintLayout without any negative margin.Just use the layout below .. It will work perfectly for all screen sizes.. 

<androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/skillsRV"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:visibility="visible"
            app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:spanCount="3" />

    <ImageView
            android:id="@+id/imageView"
            android:layout_width="20dp"
            android:layout_height="20dp"
            app:layout_constraintBottom_toBottomOf="@+id/skillsRV"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/skillsRV"
            app:srcCompat="@drawable/ic_more" />

</androidx.constraintlayout.widget.ConstraintLayout>

Upvotes: 0

Related Questions