no.hideout-lastation.com
Paradis For Designere Og Utviklere


Slik legger du til iPhone App-ikon med Cordova

For en mobilapp er ikonet en integrert del av en app som skiller den fra resten av publikum. Det er også den første tingen om en app som potensielle brukere vil se - det er derfor mange designere legger så mye inn i ikondesign. I dette innlegget, etter vår diskusjon om å bygge en mobilapp med Cordova, vil vi vise deg hvordan du legger til et ikon for appen din .

Før vi begynner, må vi først forberede ikonene. Her er noen ressurser som kan være nyttige:

  • 38 Beautiful IOS App Icon Designs for din inspirasjon
  • Lag enkelt Android eller IOS Appikoner med MakeAppIcon
  • 50 Awesome IOS Icon Designs
  • 20 Flat Mobile Icons Designs

Apple Icon Requirement

Avhengig av noen få faktorer som iOS-versjonen, vil skjermen appen være på, antall ikoner som kreves, størrelsen og pikslene kan variere mye. Apple krever mange forskjellige ikonstørrelser for å passe inn i dialogbokser for iOS på innstillingssiden, søkelyset for søkelys, hovedskjermen og så videre.

Du må ta hensyn til disse spesifikasjonene når du lager ditt ikon.

Størrelse / plattformeriOS 6.0 / 6.1iOS 7.0 / 7.1
120 x 120
114 x 114
80 x 80
58 x 58
57 x 57
29 x 29

Opprette ikonene

Forutsatt at søknaden vår skal støtte ned til iOS 6.1, trenger vi 6 størrelser for ikonet. Virker mye arbeid, va? Vel, ikke bekymre deg, som du kan bruke AppIconTemplate. AppIconTemplate er en Photoshop-mal og leveres med en forhåndsinnstilt Photoshop-handling som vil strømlinjeforme arbeidsflyten når designing og genererer flere ikonstørrelser.

Last ned og bruk malen i Photoshop, og generer ikonet med Photoshop Action. Som et eksempel, her er ikonene som vi har generert med det. Ditt ikondesign ville trolig se mye bedre ut.

Legge til ikonene i programmet

For å legge til ikonene, flytt dem til /platforms/ios/{AppName}/Resources/icons, som ble opprettet da vi tidligere lagde iOS-plattformen til prosjektet med cordova platform .

Videre er det bedre å gi nytt navn til ikonene i samsvar med Apples standard navngivningskonvensjon som vist på skjermbildet ovenfor: icon- [size] - [@ 2x]. @2x suffiks brukes til å adressere Retina display. Når ikonene er klare, klikker du på avspillingsknappen for å bygge appen og vise den i iPhone Simulator. Og du bør se ditt nye ikon, slik som det.

Fjerne ikonet Glossy Effect

Noen ganger kan den glatte effekten som iOS gir til ikonet hindre ikondetaljer. Hvis du vil fjerne den glatte effekten, åpner du filen {appname}-info.plist i Xcode. Deretter velger du YES for Icon inneholder allerede glanseffekter, som vist i følgende skjermdump.

Gjennom Xcode, start appen på nytt. Nå, som du kan se nedenfor, bør du finne at ikonet vises uten den glatte effekten.

Konklusjon

I dette innlegget har vi lagt til ikonet i vår app. Forutsatt at du har bygget app-funksjonaliteten, er vi nå et skritt nærmere publisering av appen. Det du trenger å gjøre nå, er å gjøre ikonet så attraktivt som mulig.

Multirange Polyfill Støtte for Dual-Handle HTML5 Sliders

Multirange Polyfill Støtte for Dual-Handle HTML5 Sliders

De nye innstillingene for HTML5-serien er fantastiske for mengder og dynamiske valg som datoer. Men glidebryteren for standard rekkevidde støtter ikke flere håndtak .Skriv inn multirange, en polyprofil opprettet for å støtte flere håndtak som fungerer som de skal, og støtte alle store nettlesere.Dette

(Tekniske og design tips)

5 måter å koble trådløse hodetelefoner til TV

5 måter å koble trådløse hodetelefoner til TV

Å ha en ganske ny modell-TV, forventet jeg å ha innebygd Bluetooth-støtte, slik at jeg kunne koble til de trådløse Bluetooth-hodetelefonene . Men jeg ble vist feil etter å ha brukt flere timer på å rote rundt med TV-innstillinger og håndboken.Men etter å ha gravd opp Internett fant jeg faktisk flere måter å koble trådløse hodetelefoner til TVen din, selv om det er en gammel CRT-TV som jeg skal dele med i dette innlegget. La oss komme

(Tekniske og design tips)