Drag fragment up and down

Question

I have the main activity which is composed by two fragments one called Canvas and the other is the Palette. In the main activity, the palette only appears on 25% of the screen and I want to make it possible so that the user can drag it up and down to choose colors from it. I have no idea how to do it.

main.xml:

<?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"
    android:weightSum="2">

    <FrameLayout
        android:id="@+id/canvasFragment"
        android:name="com.example.FragmentOne"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1.5" />

    <FrameLayout
        android:id="@+id/paletteFragment"
        android:name="com.example.FragmentTwo"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.5" />

</LinearLayout>

mainActivity.java:

package com.example.paint;

import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentTransaction;

import android.annotation.SuppressLint;
import android.content.Intent;
import android.graphics.Color;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        /**Canvas**/
        // Create new fragment and transaction
        Fragment canvasFragment = new CanvasFragment();
        //canvasFragment.getView().setBackgroundColor(this.cor);
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        // Replace whatever is in the fragment_container view with this fragment,
        // and add the transaction to the back stack
        transaction.replace(R.id.canvasFragment, canvasFragment);
        transaction.addToBackStack(null);
        // Commit the transaction
        transaction.commit();

        /**Palette**/
        // Create new fragment and transaction
        Fragment paletteFragment = new PaletteFragment();
        FragmentTransaction transaction2 = getSupportFragmentManager().beginTransaction();
        // Replace whatever is in the fragment_container view with this fragment,
        // and add the transaction to the back stack
        transaction2.replace(R.id.paletteFragment, paletteFragment);
        transaction2.addToBackStack(null);
        // Commit the transaction
        transaction2.commit();

        setContentView(R.layout.activity_main);
    }


}

Thanks for any help given.

Answer 1

You can use BottomSheetDialogFragment to achieve required results. This is a dialog fragment in Android Material Library.

You have to have to extend your Palette fragment with BottomSheetDialogFragment and simply use following lines to show it in Activity:

PaletteFragment paletteFragment = new PaletteFragment();
paletteFragment.show(getSupportFragmentManager(), "TAGTEXT");

In your PaletteFragment, add listener for palette to slide using BottomSheetBehavior.BottomSheetCallback(). On this callback you can update palette height on slide.