Hoe groot moeten TabBar-afbeeldingen zijn?

Ik heb pictogrammen voor een tabbalk van maat 100.

Ik heb bij Apple’s Human Interface Guidelines van 2013en er staat dat de afbeeldingsgrootte 30x30/ 60x60moet zijn.

Maar aangezien de hoogte van de tabbalkcontroller 50 is, heb ik de grootte van de afbeelding op 50x50gehouden.

Als ik het project nu uitvoer, zie ik het lelijke ontwerp hieronder:

voer hier de afbeeldingsbeschrijving in

Enig idee welk formaat afbeeldingen ik moet gebruiken zodat het ontwerp perfect is?

Opmerking:ik schrijf ook geen tekst (bijvoorbeeld Home, Zoeken, enz.). De tekst van de tab-knop staat in de afbeelding zelf.


Antwoord 1, autoriteit 100%

Volgens de Apple Human Interface-richtlijnen :

@1x : ongeveer 25 x 25 (max: 48 x 32)

@2x : ongeveer 50 x 50 (max: 96 x 64)

@3x : ongeveer 75 x 75 (max: 144 x 96)


Antwoord 2, autoriteit 55%

30×30 is punten, wat betekent 30px @1x, 60px @2x, niet ergens daartussenin. Het is ook geen goed idee om de titel van het tabblad in de afbeelding in te sluiten. Je krijgt dan behoorlijk slechte toegankelijkheids- en lokalisatieresultaten.


Antwoord 3, autoriteit 21%

Volgens de nieuwste Apple Human Interfacerichtlijnen:

In staande oriëntatie verschijnen tabbalkpictogrammen boven tabtitels. In liggende stand verschijnen de pictogrammen en titels naast elkaar. Afhankelijk van het apparaat en de oriëntatie geeft het systeem een ​​gewone of compacte tabbalk weer. Uw app moet voor beide formaten aangepaste tabbalkpictogrammen bevatten.

voer hier de afbeeldingsbeschrijving in

voer hier de afbeeldingsbeschrijving in

Ik raad je aan de bovenstaande link te gebruiken om het volledige concept te begrijpen. Omdat Apple het document regelmatig bijwerkt


Antwoord 4, autoriteit 3%

Referentie: https://developer.apple.com/ios/human-interface-guidelines/graphics/custom-icons/[https://developer.apple. com/ios/human-interface-guidelines/graphics/custom-icons/].

voer hier de afbeeldingsbeschrijving in

Dus het formaat 50×50 is een goede keuze.


Antwoord 5

Volgens mijn praktijk gebruik ik de 40 x 40 voor standaard iPad-tabbalkitempictogram, 80 x 80 voor netvlies.

Van de Apple-referentie.
https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/BarIcons.html#//apple_ref/doc/uid/TP40006556-CH21-SW1

Als je een balkpictogram wilt maken dat eruitziet alsof het gerelateerd is aan de iOS 7-pictogramfamilie, gebruik dan een heel dunne lijn om het te tekenen. Met name een streek van 2 pixels (hoge resolutie) werkt goed voor gedetailleerde pictogrammen en een streek van 3 pixels werkt goed voor minder gedetailleerde pictogrammen.

Ongeacht de visuele stijl van het pictogram, maak een werkbalk- of navigatiebalkpictogram in de volgende formaten:

Ongeveer 44 x 44 pixels
Ongeveer 22 x 22 pixels (standaard resolutie)
Maak, ongeacht de visuele stijl van het pictogram, een tabbalkpictogram in de volgende formaten:

Ongeveer 50 x 50 pixels (maximaal 96 x 64 pixels)
Ongeveer 25 x 25 pixels (maximaal 48 x 32 pixels) voor standaardresolutie

Other episodes