Skip to content

💖an Android library that makes it easier to create floating bubbles

License

Notifications You must be signed in to change notification settings

akbarrkhan/Floating-Bubble-View

 
 

Repository files navigation

Floating-Bubble-View-Library-Android

demo_0_3_4.mp4

Platform API Version License

Table of Contents

  1. Getting started
  2. Setup and Usage
  3. Sample
  4. Note
  5. License

I, Getting started 🍕🍔🍟

Ensure your app’s minimum SDK version is 21+ and `mavenCentral()` included
1. Ensure your app’s minimum SDK version is 21+. This is declared in the module-level `build.gradle` file
android {
    defaultConfig {
        ...
        minSdk 21
    }
  1. Ensure the mavenCentral() repository is declared in the project-level build.gradle or setting.gradle file:

    build.gradle (project-level)
        allprojects {
            repositories {
                mavenCentral()
                ...
            }
            ...
        }
    settings.gradle (alternative step If "allprojects" not found in the above step)
    pluginManagement {
        repositories {
            ...
            mavenCentral()
        }
    }
    dependencyResolutionManagement {
        ...
        repositories {
            ...
            mavenCentral()
        }
    }

Declare the dependencies in the module-level build.gradle file

    dependencies {
        implementation("io.github.torrydo:floating-bubble-view:<LATEST_VERSION>")
    }

II, Setup & Usage 🚀✈🛰

Step 1 : extends FloatingBubbleService then implements setupBubble() 1️⃣

Kotlin version
    class MyService: FloatingBubbleService() {

        override fun setupBubble(action: FloatingBubble.Action): FloatingBubble.Builder {
            return ...
        }

        // optional, only required if you want to navigate to the expandable-view 
        override fun setupExpandableView(action: ExpandableView.Action): ExpandableView.Builder? {
            return ...
        }
    }
Java version
    public class MyService extends FloatingBubbleService {

        @NonNull
        @Override
        public FloatingBubble.Builder setupBubble(@NonNull FloatingBubble.Action action) {
            return ...;
        }

        // optional, only required if you want to navigate to the expandable-view 
        @Nullable
        @Override
        public ExpandableView.Builder setupExpandableView(@NonNull ExpandableView.Action action) {
            return ...;
        }
    }

Step 2 : add bubble-service to manifest file 2️⃣

    <application>
        ...
        <service android:name="<YOUR_PACKAGE>.MyService" />

    </application>

Step 3 : start bubble service and enjoy 3️⃣ :)

Make sure "display over other apps" permission is granted, otherwise the app will crash

Kotlin version
    val intent = Intent(context, Myservice::class.java)

    startService(intent)           // for android version lower than 8 (android O)
    startForegroundService(intent) // for android 8 and higher
Java version
    Intent intent = new Intent(context, MyService.class);

    startService(intent);           // for android version lower than 8 (android O)
    startForegroundService(intent); // for android 8 and higher

API

Check if bubble is running:

    Boolean b = FloatingBubbleService.isRunning();

Sample class ✌😉

Kotlin version
class MyServiceKt : FloatingBubbleService() {

    // Optional. If not override. show default notification
    override fun setupNotificationBuilder(channelId: String): Notification {
        return NotificationCompat.Builder(this, channelId)
            .setOngoing(true)
            .setSmallIcon(R.drawable.ic_rounded_blue_diamond)
            .setContentTitle("bubble is running")
            .setContentText("click to do nothing")
            .setPriority(NotificationCompat.PRIORITY_MIN)
            .setCategory(Notification.CATEGORY_SERVICE)
            .build()
    }

    override fun setupBubble(action: FloatingBubble.Action): FloatingBubble.Builder {

        return FloatingBubble.Builder(this)

                // set bubble icon, currently accept only drawable and bitmap
                .setBubble(R.drawable.ic_rounded_blue_diamond)
                // set bubble's width/height
                .setBubbleSizeDp(60, 60)
                // set style for bubble, by default bubble use fade animation
                .setBubbleStyle(null)
                // set start point of bubble, (x=0, y=0) is top-left
                .setStartPoint(0, 0)
                // enable auto animate bubble to the left/right side when release, true by default
                .enableAnimateToEdge(true)

                // set close-bubble icon, currently accept only drawable and bitmap
                .setCloseBubble(R.drawable.ic_remove_icon)
                // set close-bubble's width/height
                .setCloseBubbleSizeDp(60, 60)
                // set style for close-bubble, null by default
                .setCloseBubbleStyle(null)
                // show close-bubble, true by default
                .enableCloseIcon(true)
                // enable bottom background, false by default
                .bottomBackground(true)

                .addFloatingBubbleTouchListener(object : FloatingBubble.TouchEvent {
                    override fun onDestroy() {...}

                    override fun onClick() {
                        action.navigateToExpandableView() // must override `setupExpandableView`, otherwise throw an exception
                    }

                    override fun onMove(x: Int, y: Int) {...}

                    override fun onUp(x: Int, y: Int) {...}

                    override fun onDown(x: Int, y: Int) {...}
                })
                .setAlpha(1f)
    }

    override fun setupExpandableView(action: ExpandableView.Action): ExpandableView.Builder {
        val inflater = getSystemService(LAYOUT_INFLATER_SERVICE) as LayoutInflater

        val layout = inflater.inflate(R.layout.layout_view_test, null)

        layout.findViewById<View>(R.id.card_view).setOnClickListener { view ->
            Toast.makeText(this, "hello from card view from java", Toast.LENGTH_SHORT).show();
            action.popToBubble()
        }
        return ExpandableView.Builder()
            .with(this)
            .setExpandableView(layout)
            .setDimAmount(0.8f)
            // set style for expandable view, fade animation by default
            .setExpandableViewStyle(null)
            .addExpandableViewListener(object : ExpandableView.Action {

                override fun popToBubble() {
                    action.popToBubble()
                }

                override fun onOpenExpandableView() {...}

                override fun onCloseExpandableView() {...}
            })
    }


}
Java version
public class MyService extends FloatingBubbleService {

    // Optional. If not override. show default notification
    @NonNull
    @Override
    public Notification setupNotificationBuilder(@NonNull String channelId) {
        return new NotificationCompat.Builder(this, channelId)
            .setOngoing(true)
            .setSmallIcon(R.drawable.ic_rounded_blue_diamond)
            .setContentTitle("bubble is running")
            .setContentText("click to do nothing")
            .setPriority(NotificationCompat.PRIORITY_MIN)
            .setCategory(Notification.CATEGORY_SERVICE)
            .build();
    }

    @NonNull
    @Override
    public FloatingBubble.Builder setupBubble(@NonNull FloatingBubble.Action action) {

        return new FloatingBubble.Builder(this)


                // set bubble icon, currently accept only drawable and bitmap
                .setBubble(R.drawable.ic_rounded_blue_diamond)
                // set bubble's width/height
                .setBubbleSizeDp(60, 60)
                // set style for bubble, by default bubble use fade animation
                .setBubbleStyle(null)
                // set start point of bubble, (x=0, y=0) is top-left
                .setStartPoint(0, 0)
                // enable auto animate bubble to the left/right side when release, true by default
                .enableAnimateToEdge(true)

                // set close-bubble icon, currently accept only drawable and bitmap
                .setCloseBubble(R.drawable.ic_remove_icon)
                // set close-bubble's width/height
                .setCloseBubbleSizeDp(60, 60)
                // set style for close-bubble, null by default
                .setCloseBubbleStyle(null)
                // show close-bubble, true by default
                .enableCloseIcon(true)
                // enable bottom background, false by default
                .bottomBackground(true)

                .addFloatingBubbleTouchListener(new FloatingBubble.TouchEvent() {
                    @Override
                    public void onDestroy() {...}

                    @Override
                    public void onClick() {
                        action.navigateToExpandableView(); // must override `setupExpandableView`, otherwise throw an exception
                    }

                    @Override
                    public void onMove(int x, int y) {...}

                    @Override
                    public void onUp(int x, int y) {...}

                    @Override
                    public void onDown(int x, int y) {...}
                })
                

                .setAlpha(1f);
    }

    @Nullable
    @Override
    public ExpandableView.Builder setupExpandableView(@NonNull ExpandableView.Action action) {
        LayoutInflater inflater = (LayoutInflater) getSystemService(LAYOUT_INFLATER_SERVICE);
        View layout = inflater.inflate(R.layout.layout_view_test, null);


        layout.findViewById(R.id.card_view).setOnClickListener(v -> {
            Toast.makeText(this, "hello from card view from java", Toast.LENGTH_SHORT).show();
            action.popToBubble();
        });


        return new ExpandableView.Builder(this)
                .setExpandableView(layout)
                .setDimAmount(0.8f)
                .addExpandableViewListener(new ExpandableView.Action() {
                    @Override
                    public void popToBubble() {
                        this.popToBubble();
                    }

                    @Override
                    public void onOpenExpandableView() {...}

                    @Override
                    public void onCloseExpandableView() {...}
                })
                // set style for expandable view, fade animation by default
                .setExpandableViewStyle(null)
                ;
    }
}

Note

This library is still under heavy development. There is still a lot of code cleanup to do, so expect breaking API changes over time.

Everything's gonna be ok! ^^

License



    Copyright 2022 TorryDo

    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.
    You may obtain a copy of the License at

       http://www.apache.org/licenses/LICENSE-2.0

    Unless required by applicable law or agreed to in writing, software
    distributed under the License is distributed on an "AS IS" BASIS,
    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    See the License for the specific language governing permissions and
    limitations under the License.

About

💖an Android library that makes it easier to create floating bubbles

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Kotlin 90.4%
  • Java 9.6%