Ukuthuthukiswa kohlelo lokusebenza ku-SwiftUI. Ingxenye 1: Ukugeleza kwedatha kanye ne-Redux

Ngemva kokuhambela iseshini ye-State of the Union e-WWDC 2019, nganquma ukungena ngijule ku-SwiftUI. Ngichithe isikhathi esiningi ngisebenza nayo futhi manje sengiqalile ukwenza uhlelo lokusebenza lwangempela olungaba usizo kubasebenzisi abahlukahlukene.

Ngiyibize nge-MovieSwiftUI - lolu uhlelo lokusebenza lokucinga amafilimu amasha namadala, kanye nokuwaqoqa eqoqweni kusetshenziswa. I-TMDB API. Bengilokhu ngithanda amafilimu futhi ngaze ngakha inkampani esebenza kulo mkhakha, nakuba kudala. Inkampani yayingabizwa neze ngokuthi ipholile, kodwa isicelo sasinjalo!

Siyakukhumbuza: kubo bonke abafundi be-"Habr" - isaphulelo sama-ruble angu-10 lapho ubhalisa kunoma yisiphi isifundo se-Skillbox usebenzisa ikhodi yephromoshini ethi "Habr".

I-Skillbox iyancoma: Isifundo se-inthanethi semfundo "Umthuthukisi we-Java ochwepheshe".

Ngakho-ke yini i-MovieSwiftUI engayenza?

• Isebenzisana ne-API - cishe noma yiluphi uhlelo lokusebenza lwesimanje lwenza lokhu.
• Ilayisha idatha ye-asynchronous ezicelweni futhi ihlukanise i-JSON ibe yimodeli ye-Swift isebenzisa I-Codable.
• Ibonisa izithombe ezilayishwe ngesicelo futhi izigcine kunqolobane.
• Lolu hlelo lokusebenza lwe-iOS, i-iPadOS, ne-macOS luhlinzeka nge-UX engcono kakhulu kubasebenzisi bala ma-OS.
• Umsebenzisi angakwazi ukukhiqiza idatha futhi adale olwabo uhlu lwamamuvi. Uhlelo lokusebenza lugcina futhi lubuyisele idatha yomsebenzisi.
• Ukubuka, izingxenye namamodeli ahlukaniswe ngokucacile kusetshenziswa iphethini ye-Redux. Ukugeleza kwedatha lapha akuqondile. Ingagcinwa ngokugcwele, ibuyiselwe futhi ibhalwe ngaphezulu.
• Uhlelo lokusebenza lusebenzisa izingxenye eziyisisekelo ze-SwiftUI, TabbedView, SegmentedControl, NavigationView, Form, Modal, njll. Iphinde inikeze ukubukwa kwangokwezifiso, ukuthinta, i-UI/UX.

Eqinisweni, i-animation ibushelelezi, i-GIF ivele yaba yinto encane

Ukusebenza ngohlelo lokusebenza kunginikeze ulwazi oluningi futhi sekukonke kwaba isipiliyoni esihle. Ngikwazile ukubhala uhlelo lokusebenza olusebenza ngokugcwele, ngoSepthemba ngizolithuthukisa futhi ngilishicilele ku-AppStore, ngasikhathi sinye nokukhululwa kwe-iOS 13.

I-Redux, i-BindableObject kanye ne-EnvironmentalObject

Sengisebenze neRedux cishe iminyaka emibili manje, ngakho-ke nginolwazi olunzulu ngayo. Ikakhulukazi, ngiyisebenzisa ku-frontend ye Yenza iwebhusayithi, kanye nokuthuthukisa izinhlelo zokusebenza zomdabu ze-iOS (Swift) ne-Android (Kotlin).

Angikaze ngizisole ngokukhetha i-Redux njengokwakhiwa kokugeleza kwedatha yokwakha uhlelo lokusebenza lwe-SwiftUI. Izingxenye eziyinselele kakhulu uma usebenzisa i-Redux kuhlelo lokusebenza lwe-UIKit zisebenza nesitolo futhi zithola futhi zikhipha idatha futhi yenze imephu ibe imibono/izingxenye zakho. Ukuze ngenze lokhu, kwakudingeka ngenze uhlobo lwelabhulali yezixhumi (ngisebenzisa i-ReSwift ne-ReKotlin). Isebenza kahle, kepha amakhodi amaningi impela. Ngeshwa, akuwona (okwamanje) umthombo ovulekile.

Izindaba ezinhle! Okuwukuphela kwezinto okufanele ukhathazeke ngazo nge-SwiftUI - uma uhlela ukusebenzisa i-Redux - izitolo, izifunda kanye nezinciphisi. Ukusebenzisana nesitolo kunakekelwa ngokuphelele yi-SwiftUI sibonga @EnvironmentObject. Ngakho, isitolo siqala nge-BindableObject.

Ngidale iphakethe le-Swift elilula, I-SwiftUIFlux, ehlinzeka ngokusetshenziswa okuyisisekelo kwe-Redux. Endabeni yami kuyingxenye ye-MovieSwiftUI. Nami futhi wabhala isifundo sesinyathelo ngesinyathelo, okuzokusiza ukuthi usebenzise le ngxenye.

Isebenza kanjani?

final public class Store<State: FluxState>: BindableObject {
    public let willChange = PassthroughSubject<Void, Never>()
        
    private(set) public var state: State
    
    private func _dispatch(action: Action) {
        willChange.send()
        state = reducer(state, action)
    }
}

Ngaso sonke isikhathi uma ucupha isenzo, uvula u-gearbox. Izohlola izenzo ngokuya ngesimo samanje sohlelo lokusebenza. Izobe isibuyisela isimo esisha esilungisiwe ngokuhambisana nohlobo lwesenzo nedatha.

Nokho, njengoba isitolo siyi-BindableObject, sizokwazisa i-SwiftUI uma inani laso lishintsha kusetshenziswa isakhiwo se-willChange esinikezwe i-PassthroughSubject. Lokhu kungenxa yokuthi i-BindableObject kufanele inikeze Uhlobo Lomshicileli, kodwa ukusetshenziswa kwephrothokholi kunesibopho sokuyilawula. Sekukonke, leli ithuluzi elinamandla kakhulu elivela kwa-Apple. Ngokufanelekile, kumjikelezo wokunikezela olandelayo, i-SwiftUI izosiza ukunikeza indikimba yemibono ngokuya ngoshintsho lwesimo.

Empeleni, lena yonke inhliziyo nomlingo we-SwiftUI. Manje, kunoma yikuphi ukubuka okubhalisela isimo, ukubuka kuzonikezwa ngokuya ngokuthi iyiphi idatha etholwa kuhulumeni nokuthi yini eshintshile.

class SceneDelegate: UIResponder, UIWindowSceneDelegate {
 
    var window: UIWindow?
 
 
    func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
        if let windowScene = scene as? UIWindowScene {
            let window = UIWindow(windowScene: windowScene)
            
            let controller = UIHostingController(rootView: HomeView().environmentObject(store))
            window.rootViewController = controller
            self.window = window
            window.makeKeyAndVisible()
        }
    }
}
 
struct CustomListCoverRow : View {
    @EnvironmentObject var store: Store<AppState>
    
    let movieId: Int
    var movie: Movie! {
        return store.state.moviesState.movies[movieId]
    }
    
    var body: some View {
        HStack(alignment: .center, spacing: 0) {
            Image(movie.poster)
        }.listRowInsets(EdgeInsets())
    }
}

Isitolo sijovwa njenge-EnvironmentalObject lapho uhlelo lokusebenza luqala futhi sifinyeleleka kunoma yikuphi ukubuka kusetshenziswa i-@EnvironmentObject. Asikho isijeziso sokusebenza ngoba izakhiwo ezitholiwe zitholwa ngokushesha noma zibalwa kusukela kusimo sohlelo lokusebenza.

Ikhodi engenhla ishintsha isithombe uma iphosta ye-movie ishintsha.

Futhi lokhu empeleni kwenziwa ngomugqa owodwa nje, ngosizo lapho imibono exhunywe kuhulumeni. Uma usebenze ne-ReSwift ku-iOS noma ngisho ukuxhuma nge-React, uzoqonda umlingo we-SwiftUI.

Manje ungazama ukwenza isenzo sisebenze futhi ushicilele isimo esisha. Nasi isibonelo esiyinkimbinkimbi.

struct CustomListDetail : View {
    @EnvironmentObject var store: Store<AppState>
 
    let listId: Int
    
    var list: CustomList {
        store.state.moviesState.customLists[listId]!
    }
    
    var movies: [Int] {
        list.movies.sortedMoviesIds(by: .byReleaseDate, state: store.state)
    }
    
    var body: some View {
        List {
            ForEach(movies) { movie in
                NavigationLink(destination: MovieDetail(movieId: movie).environmentObject(self.store)) {
                    MovieRow(movieId: movie, displayListImage: false)
                }
            }.onDelete { (index) in
               self.store.dispatch(action: MoviesActions.RemoveMovieFromCustomList(list: self.listId, movie: self.movies[index.first!]))
            }
        }
    }
}

Kukhodi engenhla ngisebenzisa isenzo esithi .onDelete kusuka ku-SwiftUI ku-IP ngayinye. Lokhu kuvumela irowu esohlwini ukuthi ibonise ukuswayipha okujwayelekile kwe-iOS ukuze kususwe. Ngakho uma umsebenzisi ethinta inkinobho yokususa, icupha isenzo esihambisanayo futhi isuse imuvi ohlwini.

Nokho, njengoba isakhiwo sohlu sithathwe kusimo se-BindableObject futhi sijovwa njenge-EnvironmentalObject, i-SwiftUI ibuyekeza uhlu ngoba i-ForEach ihlotshaniswa nempahla ebaliwe yamamuvi.

Nansi ingxenye yesinciphisi se-MoviesState:

func moviesStateReducer(state: MoviesState, action: Action) -> MoviesState {
    var state = state
    switch action {
    
    // other actions.
    
    case let action as MoviesActions.AddMovieToCustomList:
        state.customLists[action.list]?.movies.append(action.movie)
        
    case let action as MoviesActions.RemoveMovieFromCustomList:
        state.customLists[action.list]?.movies.removeAll{ $0 == action.movie }
        
    default:
        break
    }
    return state
}

Isinciphisi sisetshenziswa uma uthumela isenzo futhi ubuyisela isimo esisha, njengoba kushiwo ngenhla.

Ngeke ngingene emininingwaneni okwamanje - ukuthi i-SwiftUI iyazi kanjani ngempela ukuthi yini okumele ibonise. Ukuze siqonde lokhu ngokujulile, kuwufanele buka iseshini ye-WWDC ekuhambeni kwedatha ku-SwiftUI. Iphinde ichaze ngokuningiliziwe ukuthi kungani futhi nini ukusetshenziswa State, @Binding, ObjectBinding kanye ne-EnvironmentalObject.

I-Skillbox iyancoma:

• Isifundo esiwusizo "I-Mobile Developer PRO".
• Kusetshenziswe izifundo ze-inthanethi "Python Data Analyst".
• Isifundo sokwenza iminyaka emibili "Ngingumthuthukisi wewebhu we-PRO".

Source: www.habr.com