Ver Fonte

Add Meet and Zoom tab logos with retina assets.

Include template image sets at 1x, 2x, and 3x scales and wire them into the platform tab bar with configurable logo sizing.

Made-with: Cursor
huzaifahayat12 há 3 meses atrás
pai
commit
c0dd05eb00

+ 27 - 0
meetings_app/Assets.xcassets/MeetLogo.imageset/Contents.json

@@ -0,0 +1,27 @@
+{
+  "images" : [
+    {
+      "filename" : "meet_logo.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "meet_logo@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "meet_logo@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "preserves-vector-representation" : false,
+    "template-rendering-intent" : "template"
+  }
+}

BIN
meetings_app/Assets.xcassets/MeetLogo.imageset/meet_logo.png


BIN
meetings_app/Assets.xcassets/MeetLogo.imageset/meet_logo@2x.png


BIN
meetings_app/Assets.xcassets/MeetLogo.imageset/meet_logo@3x.png


+ 26 - 0
meetings_app/Assets.xcassets/ZoomLogo.imageset/Contents.json

@@ -0,0 +1,26 @@
+{
+  "images" : [
+    {
+      "filename" : "zoom_logo.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "zoom_logo@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "zoom_logo@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

BIN
meetings_app/Assets.xcassets/ZoomLogo.imageset/zoom_logo.png


BIN
meetings_app/Assets.xcassets/ZoomLogo.imageset/zoom_logo@2x.png


BIN
meetings_app/Assets.xcassets/ZoomLogo.imageset/zoom_logo@3x.png


+ 29 - 10
meetings_app/ViewController.swift

@@ -154,8 +154,8 @@ private extension ViewController {
         stack.distribution = .fillEqually
         stack.spacing = 4
 
-        stack.addArrangedSubview(topTab("Meet", icon: "􀤆", selected: true))
-        stack.addArrangedSubview(topTab("Zoom", icon: "􀤉", selected: false))
+        stack.addArrangedSubview(topTab("Meet", icon: "􀤆", selected: true, logoImageName: "MeetLogo"))
+        stack.addArrangedSubview(topTab("Zoom", icon: "􀤉", selected: false, logoImageName: "ZoomLogo", logoPointSize: 30))
         stack.addArrangedSubview(topTab("Teams", icon: "􀉨", selected: false))
         stack.addArrangedSubview(topTab("Zoho", icon: "􀯶", selected: false))
 
@@ -389,22 +389,41 @@ private extension ViewController {
         return item
     }
 
-    func topTab(_ title: String, icon: String, selected: Bool) -> NSView {
+    func topTab(_ title: String, icon: String, selected: Bool, logoImageName: String? = nil, logoPointSize: CGFloat = 26) -> NSView {
         let tab = roundedContainer(cornerRadius: 19, color: selected ? palette.primaryBlue : .clear)
         tab.translatesAutoresizingMaskIntoConstraints = false
 
-        let iconLabelView = textLabel(icon, font: typography.tabIcon, color: palette.textPrimary)
+        let leadingView: NSView
+        if let name = logoImageName, let logo = NSImage(named: name) {
+            let imageView = NSImageView(image: logo)
+            imageView.translatesAutoresizingMaskIntoConstraints = false
+            imageView.imageScaling = .scaleProportionallyDown
+            imageView.imageAlignment = .alignCenter
+            imageView.isEditable = false
+            imageView.contentTintColor = palette.textPrimary
+            leadingView = imageView
+        } else {
+            leadingView = textLabel(icon, font: typography.tabIcon, color: palette.textPrimary)
+        }
+
         let titleLabel = textLabel(title, font: typography.tabTitle, color: palette.textPrimary)
 
-        tab.addSubview(iconLabelView)
+        tab.addSubview(leadingView)
         tab.addSubview(titleLabel)
 
-        NSLayoutConstraint.activate([
-            iconLabelView.leadingAnchor.constraint(equalTo: tab.leadingAnchor, constant: 16),
-            iconLabelView.centerYAnchor.constraint(equalTo: tab.centerYAnchor),
-            titleLabel.leadingAnchor.constraint(equalTo: iconLabelView.trailingAnchor, constant: 6),
+        var constraints: [NSLayoutConstraint] = [
+            leadingView.leadingAnchor.constraint(equalTo: tab.leadingAnchor, constant: 16),
+            leadingView.centerYAnchor.constraint(equalTo: tab.centerYAnchor),
+            titleLabel.leadingAnchor.constraint(equalTo: leadingView.trailingAnchor, constant: 6),
             titleLabel.centerYAnchor.constraint(equalTo: tab.centerYAnchor)
-        ])
+        ]
+        if logoImageName != nil {
+            constraints.append(contentsOf: [
+                leadingView.widthAnchor.constraint(equalToConstant: logoPointSize),
+                leadingView.heightAnchor.constraint(equalToConstant: logoPointSize)
+            ])
+        }
+        NSLayoutConstraint.activate(constraints)
 
         return tab
     }