Comment obtenir des données de pixels au format par défaut (HTML)
[ Cet article est destiné aux développeurs Windows 8.x et Windows Phone 8.x qui créent des applications Windows Runtime. Si vous développez une application pour Windows 10, voir la Documentation ]
Vous allez découvrir comment utiliser un objet BitmapDecoder pour obtenir des données de pixels à partir d’une image. Les pixels sont rassemblés sous la forme d’un tableau d’octets et l’objet BitmapDecoder sélectionne automatiquement le meilleur format à utiliser.
BitmapDecoder peut automatiquement déterminer le format de pixel le mieux adapté pour l’image et fournir des données de pixels dans ce format. Ceci peut être utile si vous chargez des images stockés dans un format (par exemple, le format JPEG-XR) qui prend en charge une précision supérieure à 8 bits par canal. Si vous demandez à BitmapDecoder de déterminer le format de pixel optimal, vous devez détecter et gérer toutes les combinaisons de format de pixel et de mode alpha possibles puisque celles-ci sont déterminées au moment de l’exécution lors du décodage de l’image.
Remarque
Pour vous procurer des données de pixels dans un format précis, consultez la rubrique Comment obtenir des données de pixels dans un format particulier.
Ce que vous devez savoir
Technologies
Prérequis
- Nous partons du principe que vous savez créer une application Windows Runtime de base en JavaScript. Pour plus d’informations, voir Création de votre première application Windows Runtime en JavaScript.
- Vous disposez d’un objet BitmapDecoder. La rubrique Comment décoder une image vous guide tout au long du processus de création d’un objet.
Instructions
Étape 1: Obtenir un objet de décodeur
Écrivez le début d’une fonction qui reçoit un objet BitmapDecoder et déclarez des variables pour y stocker les propriétés récupérées.
function DecodeDefaultPixels(decoder) {
Le décodeur vous permet d’accéder aux données de pixels. Si vous ne disposez pas encore d’un objet de décodeur, voir Comment décoder une image.
Étape 2: Obtenir un objet de fournisseur de données de pixels
Appelez la méthode getPixelDataAsync sans aucun paramètre. Lorsque la méthode getPixelDataAsync renvoie un résultat, les données de pixels sont allouées et sont prêtes à l’emploi.
decoder.getPixelDataAsync().then(function (pixelDataProvider) {
Dans ce cas, le format de pixel et le mode alpha sont déterminés automatiquement, l’orientation EXIF est appliquée et les couleurs des données de pixels sont gérées en sRGB. Pour plus d’informations, voir getPixelDataAsync.
Étape 3: Gérer chaque combinaison de format de pixel et de mode alpha
Du fait que le format de pixel et le mode alpha des données de pixels renvoyées sont déterminés au moment de l’exécution, votre application doit détecter et gérer chaque combinaison éventuelle avec son chemin de code unique et propre. Vous pouvez déterminer le format de pixel et le mode alpha des données de pixels renvoyées en interrogeant les propriétés bitmapPixelFormat et bitmapAlphaMode dans l’objet BitmapDecoder.
Dans cet exemple, nous explorons les valeurs de canal de couleur de chaque pixel. Vous devez donc gérer des profondeurs de couleur de pixel et des classements de canaux différents.
var rawPixels = pixelDataProvider.detachPixelData();
var pixels, bOffset, gOffset; // Assign these in the below switch block.
switch (decoder.bitmapPixelFormat) {
case Windows.Graphics.Imaging.BitmapPixelFormat.rgba16:
// Allocate a typed array with the raw pixel data
var pixelBufferView_U8 = new Uint8Array(rawPixels);
// Uint16Array provides a typed view into the raw 8 bit pixel data.
pixels = new Uint16Array(pixelBufferView_U8.buffer);
gOffset = 1;
bOffset = 2;
break;
case Windows.Graphics.Imaging.BitmapPixelFormat.rgba8:
// For 8 bit pixel formats, just use the returned pixel array.
pixels = rawPixels;
gOffset = 1;
bOffset = 2;
break;
case Windows.Graphics.Imaging.BitmapPixelFormat.bgra8:
// For 8 bit pixel formats, just use the returned pixel array.
pixels = rawPixels;
// Bgra8 uses a different channel ordering than Rgba8 and Rgba16.
gOffset = 1;
bOffset = 0;
break;
}
switch (decoder.bitmapAlphaMode) {
// For our processing algorithm, ignore alpha mode.
case Windows.Graphics.Imaging.BitmapAlphaMode.premultiplied:
case Windows.Graphics.Imaging.BitmapAlphaMode.ignore:
case Windows.Graphics.Imaging.BitmapAlphaMode.straight:
break;
}
Dans cet exemple, nous utilisons des tableaux typés JavaScript pour permettre à l’application de gérer des données de pixels 16 bits (renvoyées par le format de pixel Rgba16). La méthode detachPixelData renvoie toujours un tableau contenant des valeurs 8 bits, ce qui équivaut à un tampon d’octets brut dans un langage comme C++. Un Uint16Array vous permet d’accéder aux données dans le tableau de pixels brut comme s’il s’agissait de valeurs 16 bits.
Remarque Lorsque vous créez un nouveau tableau typé, le résultat obtenu est une autre copie en mémoire des données de pixels. Si vous modifiez une image de très grande taille, cela risque d’augmenter la consommation de mémoire de votre application.
Étape 4: Parcourir les pixels en boucle
Vous disposez à présent des données de pixels et avez tenu compte du format des pixels. Vous devez maintenant les parcourir en boucle et les traiter. Le code présenté ici omet les canaux vert et bleu et ne conserve que les canaux rouge et alpha.
var orientedHeight = decoder.orientedPixelHeight;
var orientedWidth = decoder.orientedPixelWidth;
for (var i = 0; i < orientedHeight; i++) {
for (var j = 0; j < orientedWidth; j++) {
pixels[(i * orientedHeight + j) * 4 + gOffset] = 0; // Green channel
pixels[(i * orientedHeight + j) * 4 + bOffset] = 0; // Blue channel
}
}
});
}
Remarque La surcharge de paramètres mis à zéro de getPixelDataAsync applique toujours l’orientation EXIF si l’indicateur est présent dans l’image. C’est pourquoi lorsque vous vous procurez les dimensions de l’image, il est primordial d’utiliser les propriétés orientedPixelWidth et orientedPixelHeight, plutôt que les propriétés pixelWidth et pixelHeight. Les propriétés orientedPixelWidth et orientedPixelHeight reflètent tous les changements de dimension qui résultent de l’orientation EXIF.
Rubriques associées
Comment obtenir des données de pixels dans un format particulier