Swift App Icon Image Assets: Difference between revisions

From Chorke Wiki
Jump to navigation Jump to search
No edit summary
 
Line 4: Line 4:
# regular images
# regular images
regular_images:
regular_images:
   - user_icon_24x24.png       #24x24
   - user_icon_24x24.png     # 24x24
   - home_icon_24x24.png       #24x24
   - home_icon_24x24.png     # 24x24


# ios example
# ios example

Latest revision as of 08:36, 7 February 2020

# regular images
regular_images:
  - user_icon_24x24.png      # 24x24
  - home_icon_24x24.png      # 24x24

# ios example
images:
  regular: # with suffix @1x.png
    - [email protected]    # 24x24
    - [email protected]    # 24x24
  medium:  # with suffix @2x.png
    - [email protected]    # 48x48
    - [email protected]    # 48x48
 bigger:   # with suffix @3x.png
   - [email protected]     # 72x72
   - [email protected]     # 72x72
iphone:
  images:
    notification:
      - [email protected]   # 40x40
      - [email protected]   # 60x60
    settings:
      - [email protected]   # 58x58
      - [email protected]   # 87x87
    spotlight:
      - [email protected]   # 80x80
      - [email protected]   # 120x120
    app_icon:
      - [email protected]   # 120x120
      - [email protected]   # 180x180
    app_store:
      - [email protected] # 1024x1024
ipad:
  images:
    notification:
      - [email protected]   # 20x20
      - [email protected]   # 40x40
    settings:
      - [email protected]   # 29x29
      - [email protected]   # 58x58
    spotlight:
      - [email protected]   # 40x40
      - [email protected]   # 80x80
    app_icon:
      - [email protected]   # 76x76     , ipad <= 11.0"
      - [email protected]   # 152x152   , ipad <= 11.0"
      - [email protected] # 167x167   , ipad == 12.9"
      - [email protected] # 1024x1024 , app_store

Example

For each images we need 3 sizes of images as following convention:
1. <snake_case_image_name>_<image_regular_width>@1x.png
2. <snake_case_image_name>_<image_regular_width>@2x.png
3. <snake_case_image_name>_<image_regular_width>@3x.png
Example: lets say we have an Academia Logo.png with regular size of 100x30, then we have to create 3 images as following:

1. [email protected] (100x30)
2. [email protected] (200x60)
3. [email protected] (300x90)

References