Compatibility issue with KitKat (and possibly other versions)

[pablode]

Hello. I would like to integrate this library into my app (https://play.google.com/store/apps/details?id=com.pablode.labeledmusicplayer), however I ran into some compatibility issues with older android versions, more specifically KitKat (haven't tested other ones).

Basically, screenshot 1 shows how it SHOULD look. This is a screenshot of android 22 (htc one, cyanogenmod, newest version), however I can confirm that it also works on 21 (nexus 9, stock android). Additionally, this is how it looks when using the native seekbar provided by android (but obviously I don't want to use that, since I want the material style on every device, which this library tries to provide).

Screenshot 2 shows how the use of the library actually looks in an emulator of KitKat, API level 19. On the left side is the corresponding code. There is programmatical interaction, but only for setting thumb color/alpha, enabling/disabling it and bringing the view to the front.

I can provide you with more code, if needed, however I suppose it won't be relevant.

It would be awesome if you were to fix this. Thanks.

[ahmedrizwan]

Oh Ok. Yes, it's actually a problem with the base SeekBar class - so I couldn't fix it programmatically.
The solution is to just add android:maxHeight attribute, let's say android:maxHeight="300sp"
It'll fix the gravity/positioning of the thumb on all APIs.
Do try and let me know if it works. Thanks!

[pablode]

Your're right, but it only fixes a part of the issue. I set it to 300dp, out of curiosity, and the thumb is now being displayed correctly. However, as you probably can notice, there is an unwanted offset to the bar. It's supposed to be 1dp or 2dp higher, that's my guess (if you look at the code, there is a -16dp offset to the bottom).
My guess is that the seekbar view itself is shorter in height than on lollipop. This might be depending on the drawable used. Because it's short and since the bottom side is being pulled down 16dp, the center of the SeekBar is too low and not where it's supposed to be.
It sound like it could be potentially fixed by adjusting the size, but if that's not the case I could try to move the view to its center programmatically.

[ahmedrizwan]

Yea you're right! It'll be fixed in the next release (by tomorrow) as I'm making a lot of implementation changes (right now). For a very "temporary" solution, I'd recommend that you create two different layouts for API 21 and below. For 21, keep the -16dp margin and for lower APIs - try -14 or -13dp. Use this workaround for now - I'll update you as soon as I am done with the fix. Thanks!

[pablode]

That's awesome! Actually, the application uses the native SeekBar for now, but I guess I'll switch to this library once all the issues have been resolved. I'll simply put the git branch on hold for now. I'll check out the progress you made in a few days and keep you up-to-date if I experience another issue in future releases. Thank you for being so cooperative:)

[ahmedrizwan]

No problem Pablode! :)
I've updated the library - use version 0.2.0 to get the latest update.
The update fixes all the issues related to margin, positioning - and no maxHeight needed anymore :P
And I've also extended the support to also include API 14 and 15.
Do check, and let me know if it's working. Thanks!

[pablode]

Hi! I just tested version 0.2.0 and most of the problems have been resolved :)
However, unfortunately, there is a new one:

The thumb does not stay in front of the progress bar, although it moves with it. At the start it works, however the width between both components gets wider with the progress it makes. If you can't reproduce the issue, I might be able to give you more information about the circumstances.

[ahmedrizwan]

Ok - yeah, I thought I solved this issue before updating the library :P, but let me check what could be causing it.

[pablode]

Actually, I just found the cause of the issue.

        <app.minimize.com.seek_bar_compat.SeekBarCompat
            android:id="@+id/audioseekbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_above="@id/appbar"
            android:layout_marginBottom="-16dp"
            android:elevation="12dp"
            android:padding="0dp"
            app:progressColor="@color/colorAccent"
            app:progressBackgroundColor="@color/transparent"
            app:thumbColor="@color/colorAccent" />

It's the android:padding="0dp".

[ahmedrizwan]

Yeah I didn't take padding into account - as I'm calculating the thumb position manually.
Anyway I'm working on it, and it'll soon be resolved. Thanks for pointing it out. :)

[pablode]

Awesome. My app also sets the alpha value of the thumb and I don't know if that's possible using this library right now. It should be easy to implement support down to API level 16. I don't know about versions below 16 since, to my knowledge, getThumb() might not be available.

[ahmedrizwan]

Yeah setting alpha will work on all APIs because it's a custom thumb implementation (from scratch) so it's not dependent on API levels. I'll add that too.
I'm close on solving the padding issue. Will update you once done! :)

[pablode]

Thank you. Actually, the only reason why I released my app with minSDK 16 is because of that alpha issue. Now I could potentially go down to 14, which is pretty cool.

[ahmedrizwan]

Sorry I'm a bit late, but I've finally updated the library.
Please update to 0.2.1 version. I have solved the padding and speeding issue, do make sure to specify maxHeight attribute for proper thumb gravity.
And I have added a method called setThumbAlpha(), which you can use if you need to change alpha.
Thanks!

[pablode]

Thanks for updating the library. All the styling issues have been resolved, however something is still not working how I would like it to work - the fix should be simple though.
Basically I'm not able to set the thumb alpha value below Lollipop.

@TargetApi(Build.VERSION_CODES.JELLY_BEAN)
    public void setThumbAlpha(int alpha) {
        mAlpha = alpha;
        if (lollipopAndAbove())
            getThumb().setAlpha(mAlpha);
        setLayoutParams(getLayoutParams());
    }

This is the code in the library which is not correct. It should provide support down to API level 16, however that's not the case. Rather than calling lollipopAndAbove(), it should be jellybeanOrAbove, right?

Also, you might want to consider renaming mAlpha to mThumbAlpha :)

[ahmedrizwan]

No actually the method works fine, but it currently works only "programmatically" - I didn't accommodate the XML's alpha (forgot to do that, oops!) - maybe that's why you're not getting the desired results. But thanks! I'll fix this in a few minutes hopefully. :)

[ahmedrizwan]

I added an attribute called thumbAlpha - you can now set alpha value in XML also. Example is in the Read-me.
Update to version 0.2.3.
Thanks! :)

[pablode]

I've just updated to 0.2.3 and tried it out - it seems like all the issues have been resolved. Good job! If you want to include a link to it for some kind of 'library showcase' (probably not), you have my permission.

Oh, and one last thing: Android Studio 1.3 was released and brings a lot of new features. One of them is range annotations, which you could integrate to make using the API easier. More specifically, you could use @IntRange(from=.., to=..) for the setThumbAlpha method. The function would then look like this:

@TargetApi(Build.VERSION_CODES.JELLY_BEAN)
public void setThumbAlpha(@IntRange(from=0, to=255) int alpha) {
    ...
}

Here is some info about this feature:
https://youtu.be/_Rox-HXhRfI?t=1m43s

Also, documentation descriptions for setThumbAlpha and setEnabled seem to miss. Not that it matters a lot - the function names are self-explaining and the source-code is accessible.

[ahmedrizwan]

Thank you Pablode - and sorry for the late response, I've been quite busy.
I'm glad the issues were resolved - I mean... pheww! :D

Yes 'Library Showcase' seems like a good idea! I'll definitely add it!

And thanks for the @IntRrange suggestion - looks extremely useful! I'll incorporate it in the upcoming release.