/ / Comment implémenter un masque d'image? - android, interface utilisateur, android-layout

Comment mettre en œuvre un masque d'image? - Android, interface utilisateur, android-layout

Situtation:

Je travaille sur une petite application qui devraitpermet à l'utilisateur de déclencher quelque chose en fonction de la partie de l'écran sur laquelle il a cliqué. Imaginez une photo d'un ours en peluche et si vous cliquez sur un nez, il est écrit "nez". Ce que j'ai fait est de mettre en layout XML un LinearLayout. Parce que je dois couvrir différentes tailles d’écran, je n’ai pas défini d’arrière-plan dans un fichier d’agencement XML.

extrait de code xml:

<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/viewMain"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:visibility="visible" >
<LinearLayout
android:id="@+id/viewThouShaltRespondToClicks"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:clickable="true"
android:orientation="vertical"
android:longClickable="true"
android:visibility="visible" />

<!-- mask -->
<LinearLayout
android:id="@+id/viewInvisibleMask"
android:visibility="invisible"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
</LinearLayout>
</FrameLayout>

Et ensuite, dans l'événement d'activité onCreate, je vérifie la résolution d'affichage et, via setBackgroundResource (), définit le fond approprié. J'ai préparé des images de fond pour chaque résolution.

final Point QVGA = new Point(240,320);  // portrait
// Obtain the screen resolution if the device
Display defaultDisplay = ((WindowManager)this.getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
Point displayResolution = new Point(defaultDisplay.getWidth(), defaultDisplay.getHeight());
if (displayResolution.equals(QVGA))
{
viewThouShaltRespondToClicks.setBackgroundResource(R.drawable.image_to_be_clicked_upon_240x320);
viewInvisibleMask.setBackgroundResource(R.drawable.mask_240x320);

}
else if ... // check for another resolution

Même si l'image dans les ressources ne se trouve pas dans ledimension correcte, elle est étirée / réduite à la taille de l’écran. Ce serait OK tant que le rapport largeur / hauteur de l’image d’arrière-plan est similaire à celui de l’affichage et que l’image résultante n’est pas trop faible Mais il y a un problème, expliqué ci-dessous.

Pour détecter quelle région a été cliquée, la régionelle-même pourrait être de forme irrégulière, j’ai adopté l’approche suivante. Je crée une image - masque (bmp) avec les mêmes dimensions que l’image d’arrière-plan, mais uniquement avec un fond blanc et des zones cliquables de couleurs différentes. La couleur identifie la zone. Tout ce que je dois faire, c'est obtenir les coordonnées d'un événement de clic (pas de problème ici), aller à l'image du masque et lire la couleur du pixel sur ces coordonnées. Le problème est que l'image du masque n'est pas de la bonne taille. Sur mon appareil, il est réglé sur 1200x700, mais je suppose que cela prend une taille arbitraire sur d’autres appareils.

Première question: y a-t-il un moyen de convaincre d'une manière ou d'une autre la disposition invisible de charger l'image d'arrière-plan, puis de l'étirer / la réduire pour l'afficher à la taille exacte de la disposition visible?

Une autre approche serait de charger une image de masque (bmp, png) dans une structure de mémoire et de la redimensionner à la taille d'affichage. J'ai essayé avec quelque chose comme:

BitmapFactory.Options options = new BitmapFactory.Options();
options.inScaled = false;   // do not scale
options.inPreferredConfig = Bitmap.Config.ARGB_8888;
bitmapMask = BitmapFactory.decodeResource(this.getResources(), R.drawable.mask, options);
// on this place stretch shrink should follow but I have no idea how

Mais je ne sais pas comment redimensionner Bitmap à la taille voulue.

Aucune suggestion?

Réponses:

0 pour la réponse № 1

Première question: oui, vous pouvez avoir une vue distincte dans votre mise en page contenant l’image de masque et la définir comme invisible avec android:visibility=invisible.

Deuxième question: vous pouvez lire une valeur de pixel du bitmap avec Bitmap.getPixel(). Les docs sont ici.


0 pour la réponse № 2

Juste une simple suggestion. Vous pourriez avoir l'image de référence dans une image derrière l'image réelle. Les deux images sont donc chargées de la même manière, placées dans ImageViews, puis insérées dans un délai relatif. De cette façon, ils doivent être de taille égale et un seul d'entre eux est visible.

Ce n'est peut-être pas une très belle façon de le faire, et je ne suis pas sûr que cela fonctionne, mais vous pouvez l'essayer.