2011-04-22 16 views
38

He estado experimentando con una extensión de Chrome, y quiero hacer uno similar a mi Google Voice Extension donde el icono muestra un pequeño "1" azul al lado del icono cuando recibo un evento, ¿Es este un icono completo por separado? y luego solo usan el método "setIcon"? Al igual que esteGoogle Chrome números de extensión en el icono

chrome.browserAction.setIcon({path:"icon.png"}); 

He aquí un ejemplo visual de cómo se ve: enter image description here

El gmail uno parece ir hasta el hasta 500! No pueden tener un ícono para cada número, ¿o sí? ¿Hay algo que pueda usar que esté hecho para hacer esto? Ya tengo mi ícono, si tengo que hacer uno único, puedo hacer 10 y luego tener un ícono de "10+". Lo estoy conectando a una API que podría tener muchos eventos.

¿Alguien ha tenido este problema? ¿Cómo lo lograron?

¡Algún consejo o sugerencia ayudaría!

Gracias!

Respuesta

63

Se puede establecer un badge en su navegador con la acción setBadgeText:

chrome.browserAction.setBadgeText({text: "10+"}); // We have 10+ unread items. 

Tenga en cuenta que si el texto pasado es más de 4 caracteres, se trunca a los primeros 4 caracteres.

+1

Excelente, ¡gracias! –

+1

Parece que también acepta cadenas de más de 4 caracteres. He intentado un momento en el formato como "** 11: 30 **", y se muestra como un todo en la insignia. –

17

Primero tendrá que hacer algunas cosas. Debe tener una página de fondo donde debe colocar el código para mostrar BadgeText. Y segundo, tendrá que registrar su archivo de script de fondo en el archivo manifest.json.

Tienes que crear un archivo background.js o cualquier otro archivo * .js. Luego, en el archivo background.js, debe escribir este código.

chrome.browserAction.setBadgeBackgroundColor({ color: [255, 0, 0, 255] }); 
chrome.browserAction.setBadgeText({text: 'your text'}); 

Después de eso, guárdelo en la misma carpeta que su extensión. y modifique el archivo manifest.json e introduzca el código al final

, 
"background": 
{ 
    "scripts":["background.js"] 
} 

Ahora cuando vuelva a cargar la extensión verá la palabra your como texto medalla porque sólo cuatro caracteres se mostrarán en esa área pequeña. Sin embargo, no es una regla difícil y rápida que la cadena de texto se trunque a cuatro caracteres, solo que se mostrarán tantos caracteres como quepan. Necesitaba cinco personajes y tuve suerte de que dos de ellos fueran i y no ocupan mucho espacio, y se muestran los cinco caracteres. Si quieres probar, estaba tratando de mostrar Nidhi.

Cuestiones relacionadas