Here are the Top10 Android open source libraries for 2020 on GitHub.

preface

Every once in a while, I bring you a collection of open source libraries from Github, some cool and some useful tools and libraries. If you haven’t seen it before or don’t have a collection, please collect it first. Here is the link:

10 cool open source libraries are recommended

[Open source recommendation] Advanced combat, from a music player to start

No1. LiquidSwipe

This is a cool ViewPager library that displays a sliding animation of waves as you browse through different pages of the ViewPager. The USP of the library is touch-interactive. This means that touch events should be considered when displaying liquid-like display transitions in views.

1.1 How to use it?

Import the following Gradle dependencies:

implementation 'com. Making. Chrisvin: LiquidSwipe: 1.3'

Copy the code

Then add LiquidSwipeLayout to the root layout of the container that holds the fragment layout:

<androidx.constraintlayout.widget.ConstraintLayout 

    xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent">



    <com.jem.liquidswipe.LiquidSwipeViewPager

        android:id="@+id/viewpager"

        android:layout_width="match_parent"

        android:layout_height="match_parent"/>



</androidx.constraintlayout.widget.ConstraintLayout>

Copy the code

1.2 rendering

Results 1	Results 2

See Github for more details: github.com/Chrisvin/Li…

No2. Flourish

Flourish provides an elegant way to show or hide a layout by simply wrapping the View or layout and providing an API for upper-layer calls through the builder mode. Just as with dialog, call the show and dissmiss methods to show and hide. In addition, through these classes, we can also customize animations (normal, acceleration, rebound), or set our own starting point for layout orientation (upper left, lower right, etc.).

2.1 How to Use it?

Add the following dependencies to build.gradle:

dependencies {

    implementation "Com. Making. Skydoves: flourish: 1.0.0"

}

Copy the code

Then in code, build the layout:

Flourish flourish = new Flourish.Builder(parentLayout)

    // sets the flourish layout for showing and dismissing on the parent layout.

    .setFlourishLayout(R.layout.layout_flourish_main)

    // sets the flourishing animation for showing and dismissing.

    .setFlourishAnimation(FlourishAnimation.BOUNCE)

    // sets the orientation of the starting point.

    .setFlourishOrientation(FlourishOrientation.TOP_LEFT)

    // sets a flourishListener for listening changes.

    .setFlourishListener(flourishListener)

    // sets the flourish layout should be showed on start.

    .setIsShowedOnStart(false)

    // sets the duration of the flourishing.

    .setDuration(800L)

    .build();

Copy the code

DSLS are also provided with a more concise version:

val myFlourish = createFlourish(parentLayout) {

  setFlourishLayout(R.layout.layout_flourish_main)

  setFlourishAnimation(FlourishAnimation.ACCELERATE)

  setFlourishOrientation(FlourishOrientation.TOP_RIGHT)

  setIsShowedOnStart(true)

  setFlourishListener {  }

}

Copy the code

2.2 rendering

Results 1	Results 2

See Github for more details: github.com/skydoves/Fl…

No3. AestheticDialogs

AlterDialog is a beautiful and stylish AlterDialog library that currently supports six different dialogs, such as:

Flash Dialog
Connectify Dialog
Toaster Dialog
Emotion Dialog
Drake Dialog
Emoji Dialog also offers dark mode adaptation.

3.1 How to Use it?

Add the following dependencies to build.gradle:

dependencies {

.

 implementation 'com. Making. Gabriel - TheCode: AestheticDialogs: 1.1.0'

}

Copy the code

In the code, different types of dialog boxes are displayed and the corresponding method is called

Flash:

AestheticDialog.showFlashDialog(this."Your dialog Title"."Your message", AestheticDialog.SUCCESS);

AestheticDialog.showFlashDialog(this."Your dialog Title"."Your message", AestheticDialog.ERROR);

Copy the code

Connectify:

AestheticDialog.showConnectify(this."Your message", AestheticDialog.SUCCESS);

AestheticDialog.showConnectify(this."Your message", AestheticDialog.ERROR);



 /// Dark Theme

 AestheticDialog.showConnectifyDark(this."Your message",AestheticDialog.SUCCESS);

 AestheticDialog.showConnectifyDark(this."Your message", AestheticDialog.ERROR);

Copy the code

Toaster:

 AestheticDialog.showToaster(this."Your dialog Title"."Your message", AestheticDialog.ERROR);

AestheticDialog.showToaster(this."Your dialog Title"."Your message", AestheticDialog.SUCCESS);

AestheticDialog.showToaster(this."Your dialog Title"."Your message", AestheticDialog.WARNING);

 AestheticDialog.showToaster(this."Your dialog Title"."Your message", AestheticDialog.INFO);



 /// Dark Theme

 AestheticDialog.showToasterDark(this."Your dialog Title"."Your message", AestheticDialog.ERROR);

AestheticDialog.showToasterDark(this."Your dialog Title"."Your message", AestheticDialog.SUCCESS);

AestheticDialog.showToasterDark(this."Your dialog Title"."Your message", AestheticDialog.WARNING);

 AestheticDialog.showToasterDark(this."Your dialog Title"."Your message", AestheticDialog.INFO);

Copy the code

Drake :

 AestheticDialog.showDrake(this, AestheticDialog.SUCCESS);

AestheticDialog.showDrake(this, AestheticDialog.ERROR);

Copy the code

Emoji :

 AestheticDialog.showEmoji(this."Your dialog Title"."Your message", AestheticDialog.SUCCESS);

AestheticDialog.showEmoji(this."Your dialog Title"."Your message", AestheticDialog.ERROR);



/// Dark Theme

 AestheticDialog.showEmojiDark(this."Your dialog Title"."Your message", AestheticDialog.SUCCESS);

AestheticDialog.showEmojiDark(this."Your dialog Title"."Your message", AestheticDialog.ERROR);

Copy the code

Emotion :

 AestheticDialog.showEmotion(this."Your dialog Title"."Your message", AestheticDialog.SUCCESS);

AestheticDialog.showEmotion(this."Your dialog Title"."Your message", AestheticDialog.ERROR);

Copy the code

Rainbow :

 AestheticDialog.showRainbow(this."Your dialog Title"."Your message", AestheticDialog.SUCCESS);

 AestheticDialog.showRainbow(this."Your dialog Title"."Your message", AestheticDialog.ERROR);

 AestheticDialog.showRainbow(this."Your dialog Title"."Your message", AestheticDialog.WARNING);

AestheticDialog.showRainbow(this."Your dialog Title"."Your message", AestheticDialog.INFO);

Copy the code

3.2 The effect is as follows

Flash Dialog	Connectify Dialog	Toaster Dialog

Emotion Dialog	Drake Dialog	Emoji Dialog

For more details, see Github: github.com/gabriel-The…

N4. EasyReveal

As the name suggests, this is a library that provides Reveal animations in different sizes and shapes, and allows you to start and end the animation anywhere you define it on the screen.

4.1 How to Use it?

Add the following dependencies to build.gradle:

dependencies {

.

 implementation 'com. Making. Chrisvin: EasyReveal: 1.2'

}

Copy the code

Then, in XML, the View that needs to add a show or hide animation should be wrapped in EasyRevealLinearLayout:

<com.jem.easyreveal.layouts.EasyRevealLinearLayout

    .

    app:clipPathProvider="star" // possible values: circular.linear.random_line.star.sweep & wave

    app:revealAnimationDuration="2000"

    app:hideAnimationDuration="1500" >



    <! -- The views to be revealed/hidden go here -->



</com.jem.easyreveal.layouts.EasyRevealLinearLayout>

<! -- Similarly for com.jem.easyreveal.layouts.EasyRevealConstraintLayout & com.jem.easyreveal.layouts.EasyRevealFrameLayout -->

Copy the code

You can also add:

val revealLayout = EasyRevealLinearLayout(this)

// Set the ClipPathProvider that is used to clip the view for reveal animation

revealLayout.clipPathProvider = StarClipPathProvider(numberOfPoints = 6)

// Set the duration taken for reveal animation

revealLayout.revealAnimationDuration = 1500

// Set the duration taken for hide animation

revealLayout.hideAnimationDuration = 2000

// Set listener to get updates during reveal/hide animation

revealLayout.onUpdateListener = object: RevealLayout.OnUpdateListener {

    override fun onUpdate(percent: Float) {

        Toast.makeText(this@MainActivity."Revealed percent: $percent", Toast.LENGTH_SHORT).show()

    }

}

// Start reveal animation

revealLayout.reveal()

// Start hide animation

revealLayout.hide()

Copy the code

4.2 rendering

Emotion Dialog	Drake Dialog	Emoji Dialog

For more details, see Github: github.com/Chrisvin/Ea…

No5. Android ColorX

Android ColorX provides some important ways to get colors in the form of the Kotlin extension function. It makes development easier by providing conversion capabilities for different color formats (RGB, HSV, CYMK, etc.). The USP of this library has the following capabilities:

Different shades and tones of color.
Deeper and lighter shadows.
Color complement

5.1 How to Use it?

Add the following dependencies to build.gradle:

dependencies {

    implementation 'me. Jorgecastillo: androidcolorx: 0.2.0'

}

Copy the code

In code, a series of conversion methods:

val color = Color.parseColor("#e91e63")



val rgb = color.asRgb()

val argb = color.asArgb()

val hex = color.asHex()

val hsl = color.asHsl()

val hsla = color.asHsla()

val hsv = color.asHsv()

val cmyk = color.asCmyk()



val colorHsl = HSLColor(hue = 210f, saturation = 0.5 f, lightness = 0.5 f)



val colorInt = colorHsl.asColorInt()

val rgb = colorHsl.asRgb()

val argb = colorHsl.asArgb()

val hex = colorHsl.asHex()

val cmyk = colorHsl.asCmyk()

val hsla = colorHsl.asHsla()

val hsv = colorHsl.asHsv()

Copy the code

5.2 rendering

For more details, see Github: github.com/JorgeCastil…

No6. AnimatedBottomBar

This is a library of bottom navigation bars that drive the drawing. It allows you to add and remove tabs programmatically as well as through XML. In addition, we can easily intercept the TAB from the BottomBar. The Intercept TAB is useful when restricting access to advanced areas in an application’s navigation. Smooth animation offers a number of customization options, from animation interpolators to setting ripple effects.

6.1 How Can I Use it?

Add the following dependencies to build.gradle:

dependencies {

  implementation 'nl. Joery. Animatedbottombar: library: 1.0.8'

}

Copy the code

Add AnimatedBottomBar and custom attributes to the XML file

<nl.joery.animatedbottombar.AnimatedBottomBar

    android:id="@+id/bottom_bar"

    android:background="#FFF"

    android:layout_width="match_parent"

    android:layout_height="wrap_content"

    app:abb_selectedTabType="text"

    app:abb_indicatorAppearance="round"

    app:abb_indicatorMargin="16dp"

    app:abb_indicatorHeight="4dp"

    app:abb_tabs="@menu/tabs"

    app:abb_selectedIndex="1" />

Copy the code

Define the tabs. XML file in the res/menu directory:

<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item

        android:id="@+id/tab_home"

        android:icon="@drawable/home"

        android:title="@string/home" />

    <item

        android:id="@+id/tab_alarm"

        android:icon="@drawable/alarm"

        android:title="@string/alarm" />

    <item

        android:id="@+id/tab_bread"

        android:icon="@drawable/bread"

        android:title="@string/bread" />

    <item

        android:id="@+id/tab_cart"

        android:icon="@drawable/cart"

        android:title="@string/cart" />

</menu>

Copy the code

Finally, add a TAB to the code

// Creating a tab by passing values

val bottomBarTab1 = AnimatedBottomBar.createTab(drawable, "Tab 1")



// Creating a tab by passing resources

val bottomBarTab2 = AnimatedBottomBar.createTab(R.drawable.ic_home, R.string.tab_2, R.id.tab_home)

Copy the code

6.2 rendering

tab1	tab2

For more information, see Github: github.com/Droppers/An…

No7. RateBottomSheet

Sometimes, in order to promote our application, we need to let users jump to the APP store to score our APP. The traditional dialog box has poor user experience, while this library uses BottomSheet to prompt users, which is located in the thumbnail area at the bottom and has good user experience.

7.1 How to Use it?

Add the following dependencies to build.gradle:

dependencies {

implementation 'com. Mikhaellopez: ratebottomsheet: 1.1.0'

}

Copy the code

Then modify the default String resource file to change the display text:

<resources>

    <string name="rate_popup_ask_title">Like this App?</string>

    <string name="rate_popup_ask_message">Do you like using this application?</string>

    <string name="rate_popup_ask_ok">Yes I do</string>

    <string name="rate_popup_ask_no">Not really</string>



    <string name="rate_popup_title">Rate this app</string>

    <string name="rate_popup_message">Would you mind taking a moment to rate it? It won\'t take more than a minute. Thanks for your support!</string>

    <string name="rate_popup_ok">Rate it now</string>

    <string name="rate_popup_later">Remind me later</string>

    <string name="rate_popup_no">No, thanks</string>

</resources>

Copy the code

Use:

RateBottomSheetManager(this)

    .setInstallDays(1) // 3 by default

    .setLaunchTimes(2) // 5 by default

    .setRemindInterval(1) // 2 by default

    .setShowAskBottomSheet(false) // True by default

    .setShowLaterButton(false) // True by default

    .setShowCloseButtonIcon(false) // True by default

    .monitor()



// Show bottom sheet if meets conditions

// With AppCompatActivity or Fragment

RateBottomSheet.showRateBottomSheetIfMeetsConditions(this)

Copy the code

7.2 rendering

More details please see Github:github.com/lopspower/R…

No8. TransformationLayout

This is a transition animation library for Activity or Fragment and View switching. The effect is very cool. It uses the transition mode of the movement system of Material Design to create deformation animation. The library provides properties for binding target views, setting the direction of fading in and out and path movement, and many other custom options.

8.1 How to Use it?

Add the following dependencies to build.gradle:

dependencies {

    implementation "Com. Making. Skydoves: transformationlayout: 1.0.4." "

}

Copy the code

Then we need to wrap the View we want to animate into the TransformationLayout:

<com.skydoves.transformationlayout.TransformationLayout

  android:layout_width="wrap_content"

  android:layout_height="wrap_content"

  app:transformation_targetView="@+id/my_cardView" // sets a target view.

  app:transformation_duration="450" // sets a duration of the transformation.

  app:transformation_direction="auto" // auto.entering.returning

  app:transformation_fadeMode="in" // in.out.cross.through

  app:transformation_fitMode="auto" // auto.height.width

  app:transformation_pathMode="arc" // arc.linear

>



   <! -- other views -->



</com.skydoves.transformationlayout.TransformationLayout>

Copy the code

For example, if we want to transition a FAB to a card, the layout is as follows:

<com.skydoves.transformationlayout.TransformationLayout

    android:id="@+id/transformationLayout"

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    app:transformation_duration="550"

    app:transformation_targetView="@+id/myCardView">



  <com.google.android.material.floatingactionbutton.FloatingActionButton

      android:id="@+id/fab"

      android:layout_width="wrap_content"

      android:layout_height="wrap_content"

      android:backgroundTint="@color/colorPrimary"

      android:src="@drawable/ic_write"/>

</com.skydoves.transformationlayout.TransformationLayout>



<com.google.android.material.card.MaterialCardView

    android:id="@+id/myCardView"

    android:layout_width="240dp"

    android:layout_height="312dp"

    android:layout_marginLeft="30dp"

    android:layout_marginTop="30dp"

    app:cardBackgroundColor="@color/colorPrimary" />

Copy the code

There are two ways to bind a targetView to TransformationLayout:

By specifying attributes in XML:

app:transformation_targetView="@+id/myCardView"

Copy the code

Bind in code

transformationLayout.bindTargetView(myCardView)

Copy the code

When we click fab, startTransform() is called in the listener to start the transition animation and finishTransform () to start the end animation.

// start transformation when touching the fab.

fab.setOnClickListener {

  transformationLayout.startTransform()

}



// finish transformation when touching the myCardView.

myCardView.setOnClickListener {

  transformationLayout.finishTransform()

}

Copy the code

8.2 rendering

For more information, see Github: github.com/skydoves/Tr…

No9. Donut

A circular control that displays multiple data sets, with fine particle control, clearance features, animation options, and the ability to scale its values. Can be used for some statistics in the project.

9.1 How can I Use it?

Add the following dependencies to build.gradle:

dependencies {

    implementation("app.futured.donut:library:$version")

}

Copy the code

Then add a View to the layout file:

<app.futured.donut.DonutProgressView

    android:id="@+id/donut_view"

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    app:donut_bgLineColor="@color/cloud"

    app:donut_gapWidth="20"

    app:donut_gapAngle="270"

    app:donut_strokeWidth="16dp"/>

Copy the code

Then set the data in the code:

val dataset1 = DonutDataset(

    name = "dataset_1".

    color = Color.parseColor("#FB1D32"),

    amount = 1f

)



val dataset2 = DonutDataset(

    name = "dataset_2".

    color = Color.parseColor("#FFB98E"),

    amount = 1f

)



donut_view.cap = 5f

donut_view.submitData(listOf(dataset1, dataset2))

Copy the code

9.2 rendering

For more, see Github: github.com/futuredapp/…

No10. CurveGraphView

CurveGraphView is a graphics library with cool animations. In addition to great performance and many style options, the library supports multiple graphs within a single plane.

Multiple line charts are useful for comparing the prices of different stocks, mutual funds, cryptocurrencies, etc.

10.1 How Can I Use it?

Add the following dependencies to build. Gradle:

dependencies {

    implementation 'com.github.swapnil1104:CurveGraphView:{current_lib_ver}'

}

Copy the code

Add layout to XML file:

 <com.broooapps.graphview.CurveGraphView

        android:id="@+id/cgv"

        android:layout_width="0dp"

        android:layout_height="250dp"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toTopOf="parent" />

Copy the code

You then add various configuration items to your code

curveGraphView = findViewById(R.id.cgv);



curveGraphView.configure(

        new CurveGraphConfig.Builder(this)

                .setAxisColor(R.color.Blue)                                             // Set X and Y axis line color stroke.

                .setIntervalDisplayCount(7)                                             // Set number of values to be displayed in X ax

                .setGuidelineCount(2)                                                   // Set number of background guidelines to be shown.

                .setGuidelineColor(R.color.GreenYellow)                                 // Set color of the visible guidelines.

                .setNoDataMsg(" No Data ")                                              // Message when no data is provided to the view.

                .setxAxisScaleTextColor(R.color.Black)                                  // Set X axis scale text color.

                .setyAxisScaleTextColor(R.color.Black)                                  // Set Y axis scale text color

                .build()

        ););

Copy the code

3. Provide data sets

PointMap pointMap = new PointMap();

        pointMap.addPoint(0.100);

        pointMap.addPoint(1.500);

        pointMap.addPoint(5.800);

        pointMap.addPoint(4.600);

Copy the code

10.2 rendering

Results 1	Results 2

See Github for more details: github.com/swapnil1104…

conclusion

That’s the open source library recommendation for this issue, don’t forget to add it to your favorites! If you think it’s good, support it three times! If you have some interesting and cool libraries, you are welcome to leave a recommendation in the comments section. Thanks for reading and have fun coding!

Every day there are dried articles continue to update, you can search wechat “technology TOP” the first time to read, reply [mind map] [interview] [resume] Yes, I prepare some Android advanced route, interview guidance and resume template for you

Here are the Top10 Android open source libraries for 2020 on GitHub.

preface

No1. LiquidSwipe

1.1 How to use it?

1.2 rendering

No2. Flourish

2.1 How to Use it?

2.2 rendering

No3. AestheticDialogs

3.1 How to Use it?

3.2 The effect is as follows

N4. EasyReveal

4.1 How to Use it?

4.2 rendering

No5. Android ColorX

5.1 How to Use it?

5.2 rendering

No6. AnimatedBottomBar

6.1 How Can I Use it?

6.2 rendering

No7. RateBottomSheet

7.1 How to Use it?

7.2 rendering

No8. TransformationLayout

8.1 How to Use it?

8.2 rendering

No9. Donut

9.1 How can I Use it?

9.2 rendering

No10. CurveGraphView

10.1 How Can I Use it?

10.2 rendering

conclusion

Related Posts

The Activity | about the Activity, a primary development should know everything

Camera development series iv – encapsulate encoded audio and video into mp4 container using MediaMuxer

Android- Broadcast sending and receiving