Xcode: Comment ajuster la hauteur et le poids des composants en pixels?

Question

aujourd'hui est ma première journée sur Xcode et j'ai réussi à créer ma première application à vue unique.

Je n'ai pas d'expérience en Objective-C auparavant, mais j'ai fait beaucoup de HTML + CSS par le passé. Alors, quand je conçois ma première vue, j'ai créé d'abord sur PSD puis je l'ai coupé morceau par morceau pour le fond de champ de texte, bouton image, etc.

mais ce que je trouve aujourd'hui est très intéressant ...

J'ai une image PNG 483 x 82 pixels, mais quand je l'utilise en arrière-plan, je vois sur la fenêtre de l'inspecteur de taille 240 x 40. Je ne sais pas comment Xcode mesure cela, mais je crois que ce n'est pas pixel. Et étonnamment, c'est exactement la même taille que je vois sur le fichier PSD.

ma question est, comment avoir la même largeur et hauteur pour tous les composants Xcode en pixel?

merci ...

PS: voici la capture d'écran de mon bouton et sa taille:

et voici ce que j'ai sur mon Xcode, voir que l'onglet inspecteur du côté droit , il faut avoir 240 et 40 pour la largeur et la hauteur, au lieu de 483 et 82 pixels:

si je mets le vrai pixel (483x82) sur cet onglet inspecteur, le bouton sera très grand sur l'écran de l'iPad.

Answer 1

Tout d'abord, quelques informations générales concernant non-rétine et rétine images dans iOS:

• iPhone 3GS et plus, iPad 1, iPad 2 et iPad mini-(pour ne citer que quelques-uns) utiliser non retina images. C'est-à-dire que l'image que vous fournissez sera affichée à la même largeur et hauteur en pixels.

• L'iPhone 4+ et "le nouvel iPad" (iPad 3) utilisent images retina. Autrement dit, l'image que vous fournissez doit être deux fois la largeur et la hauteur en pixels comme vous le souhaitez affiché à l'écran.

Cela conduit à la notion de des points dans des applications iOS:

1 point = 1 pixel sur des dispositifs non-rétine ou 2 pixels sur les appareils de la rétine. Lorsque vous définissez des tailles dans Interface Builder (IB), vous définissez en fait point tailles, pas les pixels.

De plus, vous devez toujours fournir deux images pour la rétine non rétine et versions. Vous notez la version de la rétine en l'appelant de la même façon que la version non-rétine, puis en ajoutant @ 2x.

E.g. En procédant ainsi, le système d'exploitation sélectionnera automatiquement la bonne image pour vous sur les appareils rétiniens.

Maintenant que nous sommes clairement (er) sur ce concept, voici ce que vous faites réellement IB:

Vous avez défini la largeur et la hauteur de la vue d'image 240 pt x 40 pt, Par défaut, la propriété contentMode de la vue de l'image est définie sur UIViewContentModeScaleToFill (par conséquent, il est bon de redimensionner l'image spécifiée pour remplir la taille que vous lui avez indiquée ... donc l'image s'affichera 480px par 80px sur les appareils rétiniens, mais gardez à l'esprit , ceci apparaît "comme la même taille" en raison de ladite densité de pixels 2x et 240px par 40px sur les dispositifs non rétiniens).

Lorsque vous configurez une vue d'image, vous devez généralement effectuer les opérations suivantes:

1. comprennent à la fois la rétine et des images non-rétine dans votre projet
2. Définissez la taille du point de vue de l'image à tout ce que vous voulez qu'il soit
3. Réglez le contentMode de la vue de l'image à tout ce que vous voulez qu'il soit (vous pouvez ou ne voulez pas partir comme valeur par défaut)