Expand my Community achievements bar.

July 31st AEM Gems Webinar: Elevate your AEM development to master the integration of private GitHub repositories within AEM Cloud Manager.

IOS Card Transparency Bug


Level 4

Ok this has got to be a bug.

I have background set for a particular collection.

Then I have a card with "Text Area" background set to 50% and "Card Background" set to 0%...No problem. I can see through the text area background appears transparent on IOS phone, Tablet, Preflight and non-preflight apps. Additionally it appears correct on android and web view apps.


Using that same card, When I set the "Text Area" to 0% transparency and the "Card Background" set to 50% it does not look transparent on IOS tablet or phone. Not in the preflight or the non-preflight app. But it does appear transparent on the Web View and android device.

I have check and rechecked my setting and its the same every time. Text background transparency works across all apps and OS. But the Card background transparency only works on web app and android. No luck on IOS devices.

Can anyone confirm this?

IOS version 9.3.1

7 Replies


Level 4

Further testing this...

It seems IOS devices are just the transparency is adjusting slightly. But the shifts are much more drastic on android and web view.

IOS devices 75%-95% seem almost solid. While the web view and android seem to shift transparency as expected.

SO maybe this is a display issue or a IOS issue?

any input on this?


Level 6

Hey Steve;

Bob and I took a look at this, tried to replicate it, but didn't observe what we understand you're seeing.

On an iPhone, an iPad, and  Android tablet --  all show similar interactions of transparency. The notable differences have more to do with brightness of the device.

Something we're not completely clear on is where you expect to see card transparency.

Certain properties of a card can be transparent: card background color, image tint, and text background color support this.

Text is opaque, no transparency.

The card image is opaque if it's a jpg, a png supports transparency...

So if you're using an jpg as a card image, you cannot see through it to reveal the card background, the collection image, nor the collection background.

I have built horribly ugly cards with wide margins and padding for various properties so I can see all these transparency issues. It hurts my brain, in the best way.

If we misunderstood your design, please share some screenshots.



Level 4

Ok. Thanks for taking the time.

For testing purposes the issue is with Iphone 6 Plus and ipad Air. (Both IOS version 9.3.1)
Not sure what matters here. And I don't have older ios devices to see if they act differently. Buy these may have unique displays that are part of the issue but I would add I have played with the brightness setting on all and I'm not seeing that as a factor.

Also note that regardless of the card setting the expected effect is correct and predictable on android galaxy tab 2 and desktop viewer.

We all know Opaque is solid, and Transparency is see through.

Disregard any text or image setting for the moment because I see no issue there, but I can investigate those items later.

I will use 75% transparency for this test regardless of the color I choose the results are the same.

Also focus on the "A MESSAGE FROM" card. that is the one I'm using for this example.

If I set background to 75% trans. and text area to 0% I expect the card background to be slightly transparent.

Here you see it looks opaque (solid):


Now, Ill set the background to 0% and the text area to 75% again I expect to see through the text area just a bit.

As seen here it reacts predictably, Right?


Both 75% and only setting one or the other on IOS devices. again same test here with another card and layout.



Level 4

Here is shots of the setting in layout panel. each of these was captured with only the text area or the background area set to 75%

Both display in the layout preview as expected. But once published or previewed on IOS 6plus or ipad air the card background fails and the text background works.

Screen Shot 2016-05-03 at 9.35.09 AM.pngScreen Shot 2016-05-03 at 9.34.38 AM.png



Thanks Steve for sharing the details. I have shared the post with some other folks to explain the differences or to see if there's a bug. It occurred to me that perhaps there's some timing involved from when you make the changes to when they appear in the app; but, then again, if you are getting expected behavior on Android and Web Viewer that wouldn't seem the case.


Level 4

Great. Thanks for the time Nathan.

As for timing I also took time to try in preview app, clicking refresh or preview update. I also have testing in non-preview app and made sure to publish and wait. And results are the same.

thanks again for your support.