Hi, developers, meet the new SuperTextView!

💡 All of the above demonstrations are powered by SuperTextView.

SuperTextView is different in that it is a simple control element, but it is more than just a control. It is born flexible, powerful embedded logic, for you to continue to provide rich and colorful but extremely simple development support.

SuperTextView saves you from the complexity of rendering logic, with a single line of API calls and stunning renderings in seconds.

Just enjoy the amazing visuals you’ve created and leave the rest to SuperTextView.

In the new V3.2.1 version, SuperTextView has once again redefined itself. Developers, take a look at the surprise carefully prepared for you! 🎉 🎉 🎉

This is… Gif?

This time, SuperTextView brings powerful Gif driver support to developers.

In the past, if you’ve ever agonized over how to display a Gif on Android, or been stuck in the performance abyss of some tripartite Gif library, you can’t find your way. Now, SuperTextView is about to change all that.

Gifs come naturally to SuperTextView, so you can display a Gif in the most familiar and natural way. Just like you used to show a normal picture.

Thanks to the super high performance of C/C ++, as well as the precise operation of memory. SuperTextView uses c/ C ++ to customize a powerful Gif driver for mobile platforms.

The Gif engine of SuperTextView can accurately operate the image pixel memory, and only update the local pixel memory when the Gif image frame is refreshed, which makes a qualitative leap in Gif image rendering efficiency.

With asynchronous off-screen rendering and multi-buffering technology, SuperTextView maintains the silky smoothness of the application interface and responsive speed even when displaying large Gif images smoothly.

💡 in the Demo above, SuperTextView was used to show a Gif with a size of nearly 17M, containing 265 frames of images, and the user interface was still extremely smooth.

Displaying GIFs is super easy!

Display a Gif in a SuperTextView, super easy!

You can configure it directly in the XML layout document, or add it in code.

inXMLIn the configurationGif

<com.coorchice.library.SuperTextView
    android:id="@+id/stv_1"
    android:layout_width="match_parent"
    android:layout_height="150dp"G / / configurationif
    app:stv_state_drawable="@drawable/gif_1" />
Copy the code

You can configure the SuperTextView to display giFs just as you would a normal image.

Configure the Gif in the code

stv_1 = (SuperTextView) findViewById(R.id.stv_1);
stv_1.setDrawable(R.drawable.gif_1);
Copy the code

As simple and natural as that, SuperTextView lets you configure to display a Gif without being aware of it.

In the kernel logic of SuperTextView, SuperTextView can intelligently classify ordinary images and Gif images, and then make corresponding processing and optimization.

Display networkGifAs simple as that

What if your GIFs are not local but in the cloud?

You needn’t worry! You can leave it to SuperTextView.

stv_1 = (SuperTextView) findViewById(R.id.stv_1);
stv_1.setUrlImage("http://example.com/images/example.gif");
Copy the code

With one line of code, the SuperTextView will help you load the Gif in the background and then process the rendering to the screen.

💡 In fact, both the Drawable1 and Drawable2 image display bits of the SuperTextView can be used to display Gif images. In short, everything is as you know it.

You have more control

SuperTextView gives developers more control over the details than just showing giFs.

Play/Pause

You can control the Gif, play it, or pause it at any time.

if (stv.getDrawable() instanceof GifDrawable) {// select * from DrawableifDrawable object GifDrawable gifDrawable = (GifDrawable) stv.getDrawable(); / / play gifDrawable. Play (); / / pause gifDrawable. Stop (); }Copy the code

Jumps/gets the specified frame

In the SuperTextView, you can reach the frame you specify at any time, as well as extract the image to the specified frame.

if (stv.getDrawable() instanceof GifDrawable) {// select * from DrawableifDrawable object GifDrawable gifDrawable = (GifDrawable) stv.getDrawable(); // Jump to gifDrawable. GotoFrame (pre); Bitmap frame = gifDrawable. GetFrame (I); }Copy the code

💡 Since SuperTextView can support partial incremental rendering, when your GIFs support this rendering mode, it means you may need to turn on strict mode by calling gifdrawable.setstrict (true) to ensure that a frame jump or frame extract is correct. This can take some time, so you should try to place strict mode operations in asynchronous threads.

As fast as you like

SuperTextView allows you to change the playback rate of Gif images at will.

if (stv.getDrawable() instanceof GifDrawable) {// select * from DrawableifDrawable object GifDrawable gifDrawable = (GifDrawable) stv.getDrawable(); / / set the frame interval, 20 ms gifDrawable. SetFrameDuration (20); }Copy the code

You got it all figured out

SuperTextView lets you know the information about a Gif image at your fingertips.

  • Get Gif size

    Int width = gifDrawable. GetWidth (); Int height = gifDrawable. GetHeight ();Copy the code
  • Get Gif frame information

    / / to get frames int the frameCount = gifDrawable. GetFrameCount (); / / get the current frame interval int frameDuration = gifDrawable. GetFrameDuration (); / / get the current render to frame the int framePotision = gifDrawable. GetCurrentFrame (); Boolean isPlaying = gifDrawable. IsPlaying ();Copy the code

More colorful Gif

SuperTextView’s seamless blending of Gif rendering makes it possible to display Gif images with all of the previous Drawable1 and Drawable2 configuration items.

Gif as plain Drawable

app:stv_state_drawable_rotate="90"
Copy the code

Let’s see what happens when you put a Gif in the Drawable position.

<com.coorchice.library.SuperTextView
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:paddingLeft="62dp"
    android:paddingRight="10dp"
    android:text="The little rocket went off! "La la la la la la la..."
    android:textColor="#ffffff"
    android:textSize="22dp"
    app:stv_corner="6dp"
    app:stv_isShowState="true"
    app:stv_solid="#0D1831"/ / set the Gif
    app:stv_state_drawable="@drawable/gif_1"/ / set the GifHigh app: stv_state_drawable_height ="40dp"/ / set the GifWide app: stv_state_drawable_width ="40dp"/ / set the GifDisplay app at left: STv_state_drawable_mode ="left"/ / set the GifLeft spacing app: stv_state_drawable_padding_left ="10dp"/>
Copy the code

Effect is…

Now, try rotating the Gif 90 degrees.

<com.coorchice.library.SuperTextView ... / / set the GifRotate app by 90 degrees :stv_state_drawable_rotate="90". />Copy the code

Fillet the Gif

SuperTextView magically rounded the corners of Gif images, providing developers with more possibilities.

However, achieving this effect is surprisingly simple.

<com.coorchice.library.SuperTextView
    android:layout_width="185dp"
    android:layout_height="138.75 dp"
    android:layout_gravity="center_horizontal"
    app:stv_corner="20dp"/ / set the GifAs control background APP :stv_drawableAsBackground="true"

    app:stv_scaleType="fitCenter"G / / configurationif
    app:stv_state_drawable="@drawable/gif_1" />
Copy the code

Border the Gif

You can even border a Gif easily.

<com.coorchice.library.SuperTextView
    android:layout_width="350dp"
    android:layout_height="148.4 dp"
    android:layout_gravity="center_horizontal"
    android:gravity="center"// Add text to add style android:text="SuperTextView"

    android:textSize="36dp"
    android:textStyle="bold"
    android:visibility="invisible"
    app:stv_corner="6dp"
    app:stv_drawableAsBackground="true"
    app:stv_isShowState="true"
    app:stv_scaleType="center"// Set the border color app:stv_stroke_color="@color/ opacity_8_GRAY_4c // app:stv_stroke_width="5dp" app:stv_text_fill_color="#ccffffff"
    app:stv_text_stroke="true"
    app:stv_text_stroke_color="#cc000000"
    app:stv_text_stroke_width="2dp"G / / configurationif
    app:stv_state_drawable="@drawable/gif_1"/>
Copy the code

The effect is immediate…

Easily implement dynamic avatars

In the past, some of the coolest features were limited by the complexity and cost of implementation. SuperTextView brings more possibilities for you, and your inspiration can be free.

The implementation of dynamic avatars, for example, is probably the simplest so far.

<com.coorchice.library.SuperTextView
    android:layout_width="80dp"
    android:layout_height="80dp"
    android:layout_marginLeft="30dp"
    app:stv_corner="40dp"// Set it to background app:stv_drawableAsBackground="true"G / / configurationifHead portrait app: stv_state_drawable ="@drawable/gif_avatar"// Add border app:stv_stroke_color="#ffffff"
    app:stv_stroke_width="3dp"
    />
Copy the code

In the code, you can directly configure a network dynamic avatar.

stv.setUrlImage("http://gif_avatar.gif");
Copy the code

More surprises

Both drawables are clickable!

In the new version of SuperTextView, Drawable1 and Drawable2 have been given a new ability to respond precisely to click actions.

The SuperTextView can pinpoint the region (Drawable1, Drawable2, or any other region) where the click occurred by monitoring where the click occurred, and then trigger the corresponding callback listener.

You can set up a click-action listener on the Drawable of the SuperTextView to respond when the action occurs.

stv.setOnDrawableClickedListener(new SuperTextView.OnDrawableClickedListener() {@override public void onDrawable1Clicked(SuperTextView) {// Drawable1 clicked,dosomething... } @override public void onDrawable2Clicked(SuperTextView) {// Drawable2 clicked,dosomething... }}); stv.setOnClickListener(new View.OnClickListener() {@override public void onClick(View v) {dosomething... }});Copy the code

Background zoom mode support

Now, when you use Drawable1 as your background, you can configure different zoom modes for it to look exactly the way you want.

stv.setScaleType(ScaleType.CENTER);
Copy the code

SuperTextView provides developers with up to three zoom modes:

  • ScaleType.FIT_XY

    Stretch/compress the image into a tile.

  • ScaleType.FIT_CENTER

    Center the image adaptively.

  • ScaleType.CENTER

    Crop the picture to center. The default value.

Other updates

  • In XML layout documents, Drawable1 and Drawable2 now support setting colors or ShapeDrawable directly.

    // circle_f9ad36 is the shape file app written in XML :stv_state_drawable="@drawable/circle_f9ad36"// Use solid colors as Drawable app:stv_state_drawable="# 000000"
    Copy the code
  • ⚠️ Minimum API version increased to 19.

  • Rendering performance is at least 30% better than before.

  • Upgrade the default image loading engine to support intelligent caching. Maybe now you don’t have to introduce a third party image loading library.

💡 As 5G delivers faster network speeds and devices become more powerful, user interfaces will increasingly need more dynamic displays (past static user interfaces were too dull) to stimulate the user’s senses and interest. SuperTextView can help developers make this transition easier.

How do I start SuperTextView V3.2.1?

Add the following to build. Gradle:

dependencies {
    ...

    implementation 'com. Making. ChenBingX: SuperTextView: v3.2.1'. }Copy the code

Portal area

  • [Portal] : SuperTextView official project address

  • Portal: SuperTextView Development Reference – Can you learn how to use SuperTextView to make your application more efficient

  • Portal: SuperTextView API Documentation – You can view all available SuperTextView apis and properties


  • If you like SuperTextView, go to Github and click star 🌟 to support it.
  • CoorChice shares dry products on the blog from time to time, so check out CoorChice’s home page.