Uploaded image for project: 'Titanium SDK/CLI'
  1. Titanium SDK/CLI
  2. TIMOB-17363

Android: Add "Ti.UI.MaskedImage" support

    Details

      Description

      Original Request:
      As of Android 5.0 (aka: Android L) you can define bitmaps as an alpha mask and tint them using a color resource. You create these assets only once and color each instance to match your theme. This is done via a Java Drawable class' setTint(), setTintList(), and setTintMode() method.
      https://developer.android.com/reference/android/graphics/drawable/Drawable.html#setTint(int)

      Proposed Solution:
      This should be implemented via our existing Ti.UI.MaskedImage feature which is currently iOS only. This way we have parity between platforms.
      https://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.MaskedImage

      The concept is exactly the same. You apply a color or image to a grayscaled mask and specify the PorterDuff compositing mode.
      https://developer.android.com/reference/android/graphics/PorterDuff.Mode.html

      Instead of using Android 5.0's tinting APIs, we should use Android's Drawable and Canvas classes instead which support tinting/masking in all Android OS versions. (The new tinting methods are there out of convenience for a pre-existing feature.)

      Note:
      This feature would also provide an alternate solution for developers who want to display an ImageView with rounded borders. Since rounded borders have known hardware acceleration bugs on Google's end, an alternative solution is to use a MaskedImage with a circular mask instead. This is how it's usually done by native Android developers anyways.

        Attachments

        1. MaskedImageTest.zip
          99 kB
        2. MaskedImageTest-Android.png
          MaskedImageTest-Android.png
          180 kB
        3. MaskedImageTest-iOS.png
          MaskedImageTest-iOS.png
          69 kB
        4. Screenshot1.png
          Screenshot1.png
          389 kB
        5. Screenshot2.png
          Screenshot2.png
          455 kB
        6. Screenshot3.png
          Screenshot3.png
          379 kB
        7. Screenshot4.png
          Screenshot4.png
          170 kB
        8. Screenshot5.png
          Screenshot5.png
          411 kB
        9. Screenshot6.png
          Screenshot6.png
          494 kB
        10. Screenshot7.png
          Screenshot7.png
          393 kB
        11. Screenshot8.png
          Screenshot8.png
          199 kB

          Issue Links

            Activity

              People

              • Assignee:
                jquick Joshua Quick
                Reporter:
                ingo Ingo Muschenetz
                Reviewer:
                Gary Mathews
              • Watchers:
                6 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:

                  Backbone Issue Sync

                  • Backbone Issue Sync is enabled for your project, but we do not have any synchronization info for this issue.

                    Git Source Code