SwiftUI電子書：哈利波特

（一）App操作影片＆Gif

（二）Github連結

https://github.com/Chinger-Chang/HW2

（三）特製的 App 畫面截圖

1.iphone,ipad,mac截圖

2.App分頁截圖

（四）文字說明

這次作業卡在角色的List呈現有點久，之後才知道是程式太複雜得分出來，可能不熟悉所以分出來後又用了很久，然後還花了些時間美化，不忍心看他太空白🤣 ，雖然挺花時間，不過因為是自己很喜歡的哈利波特,做得很開心。

（五）重點程式碼說明

1.一開始封面的動畫效果，點進去entry後背景變淡，作者資訊出來。

struct HomeView: View {
    @State private var show = false
    func printFollow() {
        self.show.toggle()
    }
    var body: some View {
        ZStack(alignment:.top) {
            if show {
                ZStack{
                Image("background")
                .resizable()
                //.scaledToFill()
                .edgesIgnoringSafeArea(.all)
                    .opacity(0.5)
                VStack{
                Image("jkrowling")
                .resizable()
                .scaledToFit()
                .frame(width: 200, height: 200)
                Text("喬安娜·羅琳，筆名J. K. Rowling及Robert Galbraith，英國小說家、電影編劇及製片人，代表作為《哈利波特》系列作品。她的《哈利波特》暢銷全球，熱賣超過4億本，成為史上最暢銷的書籍之一；其同名改編電影也成為電影史上票房收入最高的電影之一。該系列電影獲得羅琳的完整授權，她還親自擔任《哈利波特－死神的聖物 (上)》和《哈利波特－死神的聖物 (下)》的電影監製。")
                    .font(Font.custom("HiraginoSans-W7", size: 22))
                    .foregroundColor(Color(red: 148/255, green: 0/255, blue: 211/255))
                        .bold()
                   .background(Color(red: 221/255, green: 160/255, blue: 221/255)).padding(50)
                    .multilineTextAlignment(.center)
                    }.padding(20)
                }
                    }
            else{
                Image("background")
                .resizable()
                //.scaledToFill()
                .edgesIgnoringSafeArea(.all)
Button(action: printFollow) {
                Text("ENTRY")
                .font(Font.custom("DevanagariSangamMN-Bold", size: 28))
                .background(Color(red: 122/255, green: 55/255, blue: 139/255))
                .foregroundColor(Color(red: 255/255, green: 131/255, blue: 120/255))
                .cornerRadius(20)
                }
            }
        }
        .animation(.easeInOut(duration: 5))
    }
}

2.加入音樂

import SwiftUI
import AVFoundation
import MediaPlayer
struct MusicView: View {
    @State var play = true
    
    let player = AVPlayer()
    let commandCenter = MPRemoteCommandCenter.shared()
    var body: some View {
        HStack{
            Text("Harry Potter - Hedwig's Theme ")
                .font(Font.custom("Baskerville-Bold", size: 23))
                .bold()
                .foregroundColor(Color(red: 0/255, green: 0/255, blue: 139/255))
            
            Spacer()
            Button(action: {
                let fileUrl=Bundle.main.url(forResource:"Hedwig",withExtension: "mp3")
                let playerItem = AVPlayerItem(url: fileUrl!)
                self.player.replaceCurrentItem(with: playerItem)
                self.play.toggle()
                if self.play{
                    self.player.pause()
                }
                else{
                    self.player.play()
                }
                self.commandCenter.playCommand.addTarget {  event in
                    if self.player.rate == 0.0 {
                        self.player.play()
                        return .success
                    }
                    return .commandFailed
                }
                
                self.commandCenter.pauseCommand.addTarget {  event in
                    if self.player.rate == 1.0 {
                        self.player.pause()
                        return .success
                    }
                    return .commandFailed
                }
                
            }){
                Image(systemName: play ? "play.circle" : "pause.circle")
                    .resizable()
                    .frame(width:30,height:30)
                    .foregroundColor(Color(red: 105/255, green: 89/255, blue: 205/255))
            }
        }
        .padding(10)
        .background(LinearGradient(gradient: Gradient(colors: [Color(red: 221/255, green: 160/255, blue: 221/255), Color(red: 138/255, green: 43/255, blue: 226/255)]), startPoint: UnitPoint(x: 0.4, y: 0.4), endPoint: UnitPoint(x: 0.4, y: 1)))
        .cornerRadius(50)
    }
}

3.客製化list

struct HouseDetail: View {
    var movie: House
    var body: some View {
        ScrollView(.vertical){
            VStack {
                HouseDetailImage(movie: movie)
                Text(movie.intro)
                    .font(Font.custom("HiraginoSans-W7", size: 22))
                    .bold().padding(20)
                    .multilineTextAlignment(.center)
                    .background(Image("house").resizable().scaledToFill().opacity(0.3))
                    .cornerRadius(30)
                    .padding(20)
                Spacer()
            }
            .navigationBarTitle(movie.name)
        }
    }
}