Prévention de la pixellisation des images, indentation des listViews et ajout de coins arrondis

Question

J'ai quelques problèmes et questions concernant le développement d'une interface utilisateur sur Android. Tout d'abord, regardez cette image :

Tout d'abord, l'image A. Il s'agit d'une image que j'insère et que je répète horizontalement pour donner la forme de zigzag en haut de l'écran, quelle que soit la taille de l'écran, et au-dessus, un champ de texte sans contenu et avec une couleur d'arrière-plan. Mais comme vous pouvez le constater, les deux couleurs ne correspondent pas parfaitement, même si elles ont la même valeur hexagonale (#BF0426). Et deuxièmement, vous pouvez également voir une sérieuse pixellisation sur cette image en zig-zag. Comment puis-je résoudre ces deux problèmes ?

Et puis à l'image B) Ici j'ai une simple listView. Ce que je voudrais faire, c'est d'abord l'indenter un peu des deux côtés, et arrondir les coins de l'élément supérieur et inférieur. En gros, je veux qu'elle ressemble à la bordure bleue dessinée sur la capture d'écran. (Votre listView iOS typique). Comment dois-je m'y prendre ?

Merci d'avance pour tout conseil !

Answer 1

Pour l'image. Par curiosité, pourquoi ne pas simplement étendre votre image pour inclure également les pixels du haut ? En d'autres termes, construisez votre image répétitive de manière à ce qu'elle incorpore les pixels que vous essayez de créer à l'aide de la fenêtre de texte vide. Cela permettra au moins de résoudre le problème de la non-concordance des couleurs, puisque la couleur sera générée au même endroit. En ce qui concerne la pixellisation. Est-ce que vous répétez vraiment l'image, ou est-ce que vous l'étalez. Un étalement causera certainement ce que vous voyez.

Pour votre tableview : Pour les retraits gauche et droit, vous pouvez simplement utiliser les attributs margin ou padding de l'élément tableview. Il existe des attributs de rembourrage et/ou de marge génériques (qui rembourreront tous les éléments supérieurs, inférieurs, gauches et droits), ou des attributs de rembourrage et/ou de marge séparés pour chaque élément supérieur, inférieur, gauche et droit. Voici un excellent lien sur le remplissage par rapport à la marge que vous voudrez peut-être lire.

Différence entre le remplissage et la marge d'une vue

Exemple d'attribut (tel qu'il est appelé dans un fichier XML) pour la marge inférieure

android:layout_marginBottom
setMargins(left, top, right, bottom) // for setting margins programmatically

Exemple d'attribut (tel qu'appelé dans un fichier XML) pour le rembourrage supérieur

android:paddingTop
setPadding(left, top, right, bottom) // for setting padding programmatically

Pour le haut et le bas personnalisés, vous devriez pouvoir utiliser le tutoriel suivant

http://www.softwarepassion.com/Android-series-custom-listview-items-and-adapters/

À partir de là, vous devriez être en mesure de détecter l'élément comme étant le premier et le dernier élément et de définir la propriété d'arrière-plan (image) sur une image d'arrière-plan ayant un haut arrondi ou un bas arrondi. C'est ainsi que je procède sur l'iPhone. J'ai également mis en œuvre des choses qui ressemblent à des tableaux mais qui sont simplement des mises en page verticales avec mes propres vues personnalisées que j'ai créées pour ressembler à ce que vous voulez.

Answer 2

Une chose à prendre en compte est que le format de fichier que vous utilisez va modifier l'image lorsque vous l'enregistrez (compression avec perte). Ainsi, un fichier .jpg avec une certaine couleur peut être différent d'un fichier .bmp avec la même couleur. Assurez-vous que vous utilisez la même application et/ou les mêmes paramètres d'exportation lorsque vous essayez de faire correspondre les images.

De plus, si vous avez créé votre image avec un DPI qui n'est pas compatible avec l'écran d'Android, cela peut provoquer une grave pixellisation dans les zones de détail, notamment avec les dégradés et les ombres portées.