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

Android: setting view.borderRadius causes backgroundColor alpha to be ignored

    Details

    • Type: Bug
    • Status: Closed
    • Priority: Critical
    • Resolution: Fixed
    • Affects Version/s: Release 6.1.1
    • Fix Version/s: Release 6.2.0
    • Component/s: Android
    • Labels:
      None
    • Story Points:
      3
    • Sprint:
      2017 Sprint 13 SDK, 2017 Sprint 14 SDK

      Description

      The below code loosely simulates how I implemented an overlay tutorial in my app using backgroundColor transparency, set via hex triplets. mainview and label represent app content. containerview is an overlay containing tutorial information, and masking view represents a view that 'darkens' the content until it needs to be highlighted. In the example below, it toggles the highlighting by setting the maskingview backgroundColor alpha to either 0 or 90% when you click the view.

      Expected result is the alpha of the maskingview backgroundColor changes and the mainview content is visible or masked. Works on both Android and iOS using SDK 5.4.0.GA. Works on iOS using SDK 6.1.0.GA, but not Android. Commenting out setting borderRadius on the maskingview (issue is both at create or runtime) solves the problem on Android.

      Steps to reproduce: uncomment the borderRadius setter below, build with 5.4.0.GA on Android. Expected result: clicking on view fades or shows the underlying "Hello". Rebuild with 6.1.0.GA on Android, clicking on view complete hides the underlying view. Comment out borderRadius setter under 6.1.0.GA, works as expected again.

      var win = Ti.UI.createWindow({
      	backgroundColor: 'black'
      });
       
      var mainview = Ti.UI.createView({
      	backgroundColor: "#202020",
      	width: 200, height: 200
      });
       
      var label = Ti.UI.createLabel({
      	text: "Hello",
      	width: 50,	height: 30,	color: "white"
      });
       
      mainview.add(label);
       
      var containerview = Ti.UI.createView({
      	backgroundColor: "#00202020",
      	width: 300, height: 300
      });
       
      var maskingview = Ti.UI.createView({
      	width: 200, height: 200, 
      	//borderRadius: 6, 
      	borderWidth: 1, 
      	borderColor: "#ff0000",
      	backgroundColor: "#e6202020"
      });
       
      containerview.add(maskingview);
      win.add(mainview);
      win.add(containerview);
       
      maskingview.addEventListener('click', function(e) {
      	maskingview.backgroundColor = (maskingview.backgroundColor == "#e6202020" ? "#00202020" : "#e6202020");
      });
      

        Attachments

          Activity

            People

            • Assignee:
              gmathews Gary Mathews
              Reporter:
              beermat Ian Wall
              Reviewer:
              Joshua Quick
              Tester:
              Lokesh Choudhary
            • Watchers:
              2 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:

                Backbone Issue Sync

                • Titanium SDK/CLI <> Titanium Mobile
                  Synced with:
                  TIMOB-10841
                  Sync status:
                  ERROR
                  Last received:
                  Last sent:

                  Git Source Code