New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 806255 link

Starred by 2 users

Issue metadata

Status: Available
Owner: ----
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Android
Pri: 3
Type: ----



Sign in to add a comment

PWA Web manifest splash screen spec for text color missing

Reported by focus3d...@gmail.com, Jan 26 2018

Issue description

Device name: Samsung Galaxy A5 

From "Settings > About Chrome"
Application version: Chrome 63.0.3239.111
Operating system: Android 1.1.1.1; SM-A500F Build/KYU84P

URLs (if applicable): source code from https://github.com/GoogleChromeLabs/airhorn

Steps to reproduce:
(1)default : with “background_color”: “#2196F3” in manifest.json 
before.png attached
(2)changes: “background_color”: “#FFFFFF” in manifest.json and "name": "Air Horner" (to see which one was used)
after.png attached


Expected result:There is no mention on how to change the app name text color on the splash screen in manifest.json


Actual result: seems text color changes on contrast : https://cs.chromium.org/chromium/src/chrome/android/java/src/org/chromium/chrome/browser/util/ColorUtils.java?q=shouldUseLightForegroundOnBackground&sq=package:chromium&l=142

This is really an issue for branding.
Thank you.
 
before.png
28.6 KB View Download
after.png
25.4 KB View Download
Labels: Needs-triage-Mobile
Cc: pnangunoori@chromium.org
Components: Blink>Forms>Color
Labels: Triaged-Mobile Needs-Feedback
focus3d.ro@ -- Thanks for reporting this issue. Could you please provide the sample APK file to reproduce this issue. This would help us in further triaging the issue.

Thanks in advance!

Comment 3 by tkent@chromium.org, Jan 29 2018

Components: -Blink>Forms>Color Blink>AppManifest

Comment 4 Deleted

Project Member

Comment 5 by sheriffbot@chromium.org, Jan 29 2018

Labels: -Needs-Feedback
Thank you for providing more feedback. Adding requester "pnangunoori@chromium.org" to the cc list and removing "Needs-Feedback" label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
This is not an Android app, but a PWA website with a manifest.json file, which get installed as an app via google chrome browser automatically or via browser menu add to Home screen)
The issue is that there is no mention on how text color can be controlled.
This the code calling the installtion https://cs.chromium.org/chromium/src/chrome/android/java/src/org/chromium/chrome/browser/webapps/AddToHomescreenDialog.java?sq=package:chromium&q=add+to+home+screen+file:%5Esrc/chrome/android/java/src/org/chromium/chrome/browser/+package:%5Echromium$&l=27
Cc: hanxi@chromium.org
Labels: Needs-Feedback
focus3d.ro@ -- Could you please provide a sample PWA website where the issue can be reproduced along with the screencast if possible. That would help us reproducing and triaging the issue.

Also CC'ing hanxi@ for the recent changes made to the file "AddToHomescreenDialog.java" as mentioned in C#6.
hanxi@ -- Could you please look into this issue.

Thanks in advance!
Hi,
I think that we are not on the same page and I am deeply sorry for that: I am asking for text color in the splash screen of a website using service worker aka PWA, installed via google chrome browser (add to Home screen) in android device.

manifest.json from  https://github.com/GoogleChromeLabs/airhorn and live website at https://airhorner.com/:
{
  "name": "The Air Horner",
  "short_name": "Air Horner",
  "icons": [{
        "src": "images/touch/Airhorner_128.png",
        "type": "image/png",
        "sizes": "128x128"
      }, {
        "src": "images/touch/Airhorner_152.png",
        "type": "image/png",
        "sizes": "152x152"
      }, {
        "src": "images/touch/Airhorner_144.png",
        "type": "image/png",
        "sizes": "144x144"
      }, {
        "src": "images/touch/Airhorner_192.png",
        "type": "image/png",
        "sizes": "192x192"
      },
      {
        "src": "images/touch/Airhorner_256.png",
        "type": "image/png",
        "sizes": "256x256"
      },
      {
        "src": "images/touch/Airhorner_512.png",
        "type": "image/png",
        "sizes": "512x512"
      }],
  "start_url": "/?homescreen=1",
  "scope": "/",
  "display": "standalone",
  "background_color": "#2196F3",
  "theme_color": "#2196F3"
}
As you can see for the color of the text ("name"), there is no way to define it and its color is defined (I think) by shouldUseLightForegroundOnBackground from https://cs.chromium.org/chromium/src/chrome/android/java/src/org/chromium/chrome/browser/util/ColorUtils.java?q=shouldUseLightForegroundOnBackground&sq=package:chromium&l=142

I apologies if my issue was not as clearer as it should be.

Thanks in advance.
Project Member

Comment 9 by sheriffbot@chromium.org, Jan 30 2018

Labels: -Needs-Feedback
Thank you for providing more feedback. Adding requester "pnangunoori@chromium.org" to the cc list and removing "Needs-Feedback" label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot

Comment 10 by hanxi@chromium.org, Jan 30 2018

Cc: dominickn@chromium.org
From the Web Manifest spec (https://www.w3.org/TR/appmanifest/#background_color-member), I don't think you can define the color of the title shown on the splash scree. The color of the text is set in code: https://cs.chromium.org/chromium/src/chrome/android/java/src/org/chromium/chrome/browser/webapps/WebappSplashScreenController.java?rcl=68e2ab63a7358d28f61f467c3d4731e45c6e73d8&l=256.

+Dominick: is there any plan to add customized color for the Web app name on the splash screen?
Components: -Blink>AppManifest UI>Browser>WebAppInstalls
Status: Available (was: Unconfirmed)
There is some work to try and spec the web app splash screen at https://github.com/w3c/manifest/issues/589, with the core proposal being a snapshot-based approach so developers can use arbitrary HTML styling. However, we're transitioning to ChromeOS focused work in Sydney, so our team will not be able to move this forward any more.

Hopefully there will be some interest from the platform or mobile orgs to work on making web app splashscreens more customisable for developers.

Sign in to add a comment