[Feature] Add audio playback widget

App/App.swift

@@ -50,5 +50,6 @@ extension WidgetExamplesApp {
         renderer.scale = 10
         let filename = URL.documentsDirectory.appending(path: "SharedViewWidget.png")
         try? renderer.uiImage?.pngData()?.write(to: filename)
+        print(filename)
     }
 }

App/Navigation/AppScreen.swift

@@ -24,6 +24,7 @@ import SwiftUI
 
 enum AppScreen: Hashable, CaseIterable {
     case appGroup
+    case audioPlayback
     case coreData
     case dynamicIntent
     case liveActivity
@@ -44,6 +45,8 @@ extension AppScreen {
         switch self {
         case .appGroup:
             "App Group"
+        case .audioPlayback:
+            "Audio Playback"
         case .coreData:
             "Core Data"
         case .dynamicIntent:
@@ -70,6 +73,8 @@ extension AppScreen {
         switch self {
         case .appGroup:
             AppGroupWidgetView()
+        case .audioPlayback:
+            AudioPlaybackWidgetView()
         case .coreData:
             CoreDataWidgetView()
         case .dynamicIntent:

App/Screens/AudioPlayback/AudioPlaybackWidgetView.swift

@@ -0,0 +1,80 @@
+// The MIT License (MIT)
+//
+// Copyright (c) 2024-Present Paweł Wiszenko
+//
+// Permission is hereby granted, free of charge, to any person obtaining a copy
+// of this software and associated documentation files (the "Software"), to deal
+// in the Software without restriction, including without limitation the rights
+// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+// copies of the Software, and to permit persons to whom the Software is
+// furnished to do so, subject to the following conditions:
+//
+// The above copyright notice and this permission notice shall be included in all
+// copies or substantial portions of the Software.
+//
+// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+// SOFTWARE.
+
+import SwiftUI
+import WidgetKit
+
+struct AudioPlaybackWidgetView: View {
+    @AppStorage(UserDefaultKey.isAudioPlaying, store: .appGroup)
+    private var isPlaying = false
+
+    var body: some View {
+        List {
+            Section {
+                contentView
+            } header: {
+                headerView
+            }
+        }
+        .onChange(of: isPlaying) {
+            reloadWidgetTimelines()
+        }
+    }
+}
+
+// MARK: - Content
+
+extension AudioPlaybackWidgetView {
+    private var headerView: some View {
+        Text("Audio Playback")
+    }
+
+    @ViewBuilder
+    private var contentView: some View {
+        stateView
+        buttonsView
+    }
+
+    private var stateView: some View {
+        Text(isPlaying ? "Playing..." : "Paused")
+    }
+
+    private var buttonsView: some View {
+        AudioPlaybackWidgetButtonsView(isPlaying: isPlaying)
+    }
+}
+
+// MARK: - Helpers
+
+extension AudioPlaybackWidgetView {
+    private func reloadWidgetTimelines() {
+        WidgetCenter.shared.reloadTimelines(ofKind: WidgetType.audioPlayback.kind)
+    }
+}
+
+// MARK: - Preview
+
+#Preview {
+    NavigationStack {
+        AudioPlaybackWidgetView()
+    }
+}

README.md

@@ -2,18 +2,10 @@
   <img src="./.resources/Assets/logo.png" alt="Widget Examples logo" height=150>
 </p>
 <p align="center">
-  <a href="https://github.com/pawello2222/WidgetExamples/actions?query=branch%3Amain">
-    <img src="https://img.shields.io/github/actions/workflow/status/pawello2222/WidgetExamples/ci.yml?logo=github" alt="Build">
-  </a>
-  <a href="https://github.com/pawello2222/WidgetExamples">
-    <img src="https://img.shields.io/badge/language-swift-orange.svg" alt="Language">
-  </a>
-  <a href="https://github.com/pawello2222/WidgetExamples/releases">
-    <img src="https://img.shields.io/github/v/release/pawello2222/WidgetExamples" alt="Release version">
-  </a>
-  <a href="https://github.com/pawello2222/WidgetExamples/blob/main/LICENSE.md">
-    <img src="https://img.shields.io/github/license/pawello2222/WidgetExamples" alt="License">
-  </a>
+  <a href="https://github.com/pawello2222/WidgetExamples/actions?query=branch%3Amain"><img src="https://img.shields.io/github/actions/workflow/status/pawello2222/WidgetExamples/ci.yml?logo=github" alt="Build"></a>
+  <a href="https://github.com/pawello2222/WidgetExamples"><img src="https://img.shields.io/badge/language-swift-orange.svg" alt="Language"></a>
+  <a href="https://github.com/pawello2222/WidgetExamples/releases"><img src="https://img.shields.io/github/v/release/pawello2222/WidgetExamples" alt="Release version"></a>
+  <a href="https://github.com/pawello2222/WidgetExamples/blob/main/LICENSE.md"><img src="https://img.shields.io/github/license/pawello2222/WidgetExamples" alt="License"></a>
 </p>
 
 # Widget Examples
@@ -25,14 +17,15 @@ A demo project showing different types of Widgets created with SwiftUI and Widge
     <b>Table of Contents</b>
   </summary>
 
-  1. [Gallery](#gallery)
-  2. [Unofficial gallery](#unofficial)
+  1. [Basic widgets](#basic)
+  2. [Intent widgets](#intent)
+  2. [Unofficial widgets](#unofficial)
   3. [Installation](#installation)
   4. [License](#license)
 
 </details>
 
-## Gallery <a name="gallery"></a>
+## Basic widgets <a name="basic"></a>
 
 <table>
   <tr>
@@ -75,107 +68,132 @@ A demo project showing different types of Widgets created with SwiftUI and Widge
     <th align="center">
       <a href="./Widgets/DigitalClockWidget">Digital&nbsp;Clock</a>
     </th>
-    <th align="center">
-      <a href="./Widgets/DynamicIntentWidget">Dynamic&nbsp;Intent</a>
+    <th align="center" colspan="2">
+      <a href="./Widgets/LiveActivityWidget">Live&nbsp;Activity</a>
     </th>
     <th align="center">
       <a href="./Widgets/EnvironmentWidget">Environment</a>
     </th>
-    <th align="center">
-      <a href="./Widgets/IntentWidget">Intent</a>
-    </th>
   </tr>
   <tr>
     <td align="center">
       <a href="./Widgets/DigitalClockWidget">
         <img src="./.resources/Screenshots/DigitalClockWidget.png" alt="Digital Clock Widget">
       </a>
     </td>
-    <td align="center">
-      <a href="./Widgets/DynamicIntentWidget">
-        <img src="./.resources/Screenshots/DynamicIntentWidget.png" alt="Dynamic Intent Widget">
+    <td align="center" colspan="2">
+      <a href="./Widgets/LiveActivityWidget">
+        <img src="./.resources/Screenshots/LiveActivityWidget.png" alt="Live Activity Widget">
       </a>
     </td>
     <td align="center">
       <a href="./Widgets/EnvironmentWidget">
         <img src="./.resources/Screenshots/EnvironmentWidget.png" alt="Environment Widget">
       </a>
     </td>
-    <td align="center">
-      <a href="./Widgets/IntentWidget">
-        <img src="./.resources/Screenshots/IntentWidget.png" alt="Intent Widget">
-      </a>
-    </td>
   </tr>
-  <tr>
+    <tr>
     <th align="center">
-      <a href="./Widgets/InteractiveWidget">Interactive</a>
+      <a href="./Widgets/LockScreenWidget">Lock&nbsp;Screen</a>
     </th>
-    <th align="center" colspan="2">
-      <a href="./Widgets/LiveActivityWidget">Live&nbsp;Activity</a>
+    <th align="center">
+      <a href="./Widgets/NetworkWidget">Network</a>
     </th>
     <th align="center">
-      <a href="./Widgets/LockScreenWidget">Lock&nbsp;Screen</a>
+      <a href="./Widgets/SharedViewWidget">Shared&nbsp;View</a>
+    </th>
+    <th align="center">
+      <a href="./Widgets/SwiftDataWidget">SwiftData</a>
     </th>
   </tr>
   <tr>
     <td align="center">
-      <a href="./Widgets/InteractiveWidget">
-        <img src="./.resources/Screenshots/InteractiveWidget.png" alt="Interactive Widget">
+      <a href="./Widgets/LockScreenWidget">
+        <img src="./.resources/Screenshots/LockScreenWidget.png" alt="Lock Screen Widget">
       </a>
     </td>
-    <td align="center" colspan="2">
-      <a href="./Widgets/LiveActivityWidget">
-        <img src="./.resources/Screenshots/LiveActivityWidget.png" alt="Live Activity Widget">
+    <td align="center">
+      <a href="./Widgets/NetworkWidget">
+        <img src="./.resources/Screenshots/NetworkWidget.png" alt="Network Widget">
       </a>
     </td>
     <td align="center">
-      <a href="./Widgets/LockScreenWidget">
-        <img src="./.resources/Screenshots/LockScreenWidget.png" alt="Lock Screen Widget">
+      <a href="./Widgets/SharedViewWidget">
+        <img src="./.resources/Screenshots/SharedViewWidget.png" alt="Shared View Widget">
+      </a>
+    </td>
+    <td align="center">
+      <a href="./Widgets/SwiftDataWidget">
+        <img src="./.resources/Screenshots/SwiftDataWidget.png" alt="SwiftData Widget">
       </a>
     </td>
   </tr>
-    <tr>
+  <tr>
+    <th align="center" width="25%">
+      <a href="./Widgets/URLImageWidget">URL&nbsp;Image</a>
+    </th>
+    <th align="center" width="25%"></th>
+    <th align="center" width="25%"></th>
+    <th align="center" width="25%"></th>
+  </tr>
+  <tr>
+    <td align="center">
+      <a href="./Widgets/URLImageWidget">
+        <img src="./.resources/Screenshots/URLImageWidget.png" alt="URL Image Widget">
+      </a>
+    </td>
+    <td align="center"></td>
+    <td align="center"></td>
+    <td align="center"></td>
+  </tr>
+</table>
+
+## Intent widgets <a name="intent"></a>
+
+The following widgets use Intents. Please refer to the [documentation](https://developer.apple.com/documentation/appintents/appintent) for a more detailed explanation.
+
+<table>
+  <tr>
     <th align="center">
-      <a href="./Widgets/NetworkWidget">Network</a>
+      <a href="./Widgets/AudioPlaybackWidget">Audio&nbsp;Playback</a>
     </th>
     <th align="center">
-      <a href="./Widgets/SharedViewWidget">Shared&nbsp;View</a>
+      <a href="./Widgets/DynamicIntentWidget">Dynamic&nbsp;Intent</a>
     </th>
     <th align="center">
-      <a href="./Widgets/SwiftDataWidget">SwiftData</a>
+      <a href="./Widgets/IntentWidget">Intent</a>
     </th>
     <th align="center">
-      <a href="./Widgets/URLImageWidget">URL&nbsp;Image</a>
+      <a href="./Widgets/InteractiveWidget">Interactive</a>
     </th>
   </tr>
   <tr>
     <td align="center">
-      <a href="./Widgets/NetworkWidget">
-        <img src="./.resources/Screenshots/NetworkWidget.png" alt="Network Widget">
+      <a href="./Widgets/AudioPlaybackWidget">
+        <img src="./.resources/Screenshots/AudioPlaybackWidget" alt="Audio Playback Widget">
       </a>
     </td>
     <td align="center">
-      <a href="./Widgets/SharedViewWidget">
-        <img src="./.resources/Screenshots/SharedViewWidget.png" alt="Shared View Widget">
+      <a href="./Widgets/DynamicIntentWidget">
+        <img src="./.resources/Screenshots/DynamicIntentWidget.png" alt="Dynamic Intent Widget">
       </a>
     </td>
     <td align="center">
-      <a href="./Widgets/SwiftDataWidget">
-        <img src="./.resources/Screenshots/SwiftDataWidget.png" alt="SwiftData Widget">
+      <a href="./Widgets/IntentWidget">
+        <img src="./.resources/Screenshots/IntentWidget.png" alt="Intent Widget">
       </a>
     </td>
     <td align="center">
-      <a href="./Widgets/URLImageWidget">
-        <img src="./.resources/Screenshots/URLImageWidget.png" alt="URL Image Widget">
+      <a href="./Widgets/InteractiveWidget">
+        <img src="./.resources/Screenshots/InteractiveWidget.png" alt="Interactive Widget">
       </a>
     </td>
   </tr>
 </table>
 
-## Unofficial gallery <a name="unofficial"></a>
+## Unofficial widgets <a name="unofficial"></a>
 
-Please be aware that the folowing widgets use private API. This means they not necessarily have to pass Apple Review and you use them at your own risk.
+The folowing widgets use private API. Please bear in mind that they don't necessarily have to pass the Apple review process and you use them at your own risk.
 
 <table>
   <tr>