Nts'etsopele ea ts'ebeliso ho SwiftUI. Karolo ea 1: Dataflow le Redux

Nts'etsopele ea ts'ebeliso ho SwiftUI. Karolo ea 1: Dataflow le Redux

Kamora ho ea kopanong ea State of the Union ho WWDC 2019, ke ile ka etsa qeto ea ho qoela ka botebo ho SwiftUI. Ke qetile nako e ngata ke sebetsa le eona 'me joale ke qalile ho etsa kopo ea' nete e ka bang molemo ho mefuta e mengata ea basebelisi.

Ke e bitsitse MovieSwiftUI - ena ke sesebelisoa sa ho batla lifilimi tse ncha le tsa khale, hammoho le ho li bokella ka pokellong li sebelisa. TMDB API. Haesale ke rata lifilimi esita le ho theha k'hamphani e sebetsang tšimong ena, leha e le khale haholo. Khampani e ne e ke ke ea bitsoa e pholileng, empa kopo e ne e le!

Re hopotsa: bakeng sa babali bohle ba "Habr" - theolelo ea li-ruble tse 10 ha u ngolisa thupelong efe kapa efe ea Skillbox u sebelisa khoutu ea papatso ea "Habr".

Skillbox e khothaletsa: Lithuto tsa inthaneteng "Professional Java Developer".

Joale MovieSwiftUI e ka etsa eng?

  • E sebelisana le API - hoo e batlang e le ts'ebeliso efe kapa efe ea sejoale-joale e etsa sena.
  • E jara data ea asynchronous mabapi le likopo mme e fetise JSON ho mofuta oa Swift e sebelisa Codable.
  • E bonts'a litšoantšo tse kentsoeng ka kopo le ho li boloka.
  • Sesebelisoa sena sa iOS, iPadOS, le macOS se fana ka UX e ntle ka ho fetisisa bakeng sa basebelisi ba li-OS tsena.
  • Mosebedisi a ka hlahisa data mme a iketsetsa manane a bona a lifilimi. Sesebelisoa se boloka le ho khutlisetsa data ea mosebelisi.
  • Maikutlo, likarolo le mehlala li arotsoe ka mokhoa o hlakileng ho sebelisoa mohlala oa Redux. Phallo ea data mona ke ea unidirectional. E ka bolokoa ka ho feletseng, ea tsosolosoa le ho ngoloa.
  • Sesebelisoa se sebelisa likarolo tsa mantlha tsa SwiftUI, TabbedView, SegmentedControl, NavigationView, Foromo, Modal, jj. E boetse e fana ka maikutlo a tloaelo, boitšisinyo, UI/UX.

Nts'etsopele ea ts'ebeliso ho SwiftUI. Karolo ea 1: Dataflow le Redux
Ha e le hantle, animation e boreleli, GIF e ile ea fetoha e nyenyane

Ho sebetsa ho app ho ile ha mpha boiphihlelo bo bongata mme ka kakaretso e bile boiphihlelo bo monate. Ke khonne ho ngola kopo e sebetsang ka botlalo, ka September ke tla e ntlafatsa le ho e phatlalatsa ho AppStore, ka nako e le 'ngoe le ho lokolloa ha iOS 13.

Redux, BindableObject le EnvironmentObject

Nts'etsopele ea ts'ebeliso ho SwiftUI. Karolo ea 1: Dataflow le Redux

Ke sebelitse le Redux lilemo tse ka bang peli joale, kahoo ke e tseba hantle. Ka ho khetheha, ke e sebelisa ho frontend bakeng sa Etsa joalo webosaete, hammoho le ho nts'etsapele lits'ebetso tsa matsoalloa tsa iOS (Swift) le Android (Kotlin).

Ha ke so ikoahlaele ho khetha Redux joalo ka meralo ea phallo ea data bakeng sa ho aha sesebelisoa sa SwiftUI. Likarolo tse thata ka ho fetesisa ha u sebelisa Redux ho sesebelisoa sa UIKit li sebetsa le lebenkele le ho fumana le ho khutlisa data le ho e etsa 'mapa ho latela maikutlo / likarolo tsa hau. Ho etsa sena, ke ne ke tlameha ho theha mofuta oa laeborari ea lihokelo (ho sebelisa ReSwift le ReKotlin). E sebetsa hantle, empa khoutu e ngata haholo. Ka bomalimabe, ha e so (hajoale) mohloli o bulehileng.

Litaba tse monate! Lintho feela tseo u ka tšoenyehang ka tsona ka SwiftUI - haeba u rera ho sebelisa Redux - ke mabenkele, linaha le li-reducers. Ho sebelisana le lebenkele ho hlokomeloa ka botlalo ke SwiftUI ka lebaka la @EnvironmentObject. Kahoo, lebenkele le qala ka BindableObject.

Ke thehile sephutheloana se bonolo sa Swift, SwiftUIFlux, e fanang ka ts'ebeliso ea mantlha ea Redux. Tabeng ea ka ke karolo ea MovieSwiftUI. Le 'na o ngotse thuto ea mohato ka mohato, e tla u thusa ho sebelisa karolo ena.

Hona e sebetsa?

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)
    }
}

Nako le nako ha o etsa ketso, o kenya lebokose la gear. E tla hlahloba liketso ho latela boemo ba hona joale ba kopo. E tla khutlisa boemo bo bocha bo fetotsoeng ho latela mofuta oa ts'ebetso le data.

Kaha lebenkele ke BindableObject, e tla tsebisa SwiftUI ha boleng ba eona bo fetoha ho sebelisa thepa ea willChange e fanoeng ke PassthroughSubject. Lebaka ke hobane BindableObject e tlameha ho fana ka Mofuta oa Mophatlalatsi, empa ts'ebetsong ea protocol e ikarabella ho e laola. Ka kakaretso, sena ke sesebelisoa se matla haholo se tsoang ho Apple. Ka hona, potolohong e latelang ea phetolelo, SwiftUI e tla thusa ho fana ka maikutlo a 'mele ho latela phetoho ea mmuso.

Ebile, sena ke pelo le boselamose ba SwiftUI. Hona joale, ponong leha e le efe e ngolisitseng mmuso, pono e tla fanoa ho latela hore na ke lintlha life tse amoheloang ho tsoa mmuso le hore na ke eng e fetohileng.

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())
    }
}

Lebenkele le kentsoe joalo ka EnvironmentObject ha ts'ebeliso e qala mme e ka fumaneha ka pono efe kapa efe ho sebelisoa @EnvironmentObject. Ha ho na kotlo ea ts'ebetso hobane thepa e nkiloeng e khutlisoa kapele kapa e baloa ho tsoa maemong a kopo.

Khoutu e ka holimo e fetola setšoantšo haeba setšoantšo sa filimi se fetoha.

'Me sena se hlile se etsoa ka mohala o le mong feela, ka thuso ea maikutlo a amanang le naha. Haeba u sebelitse le ReSwift ho iOS kapa esita le amahanya ka React, o tla utloisisa boloi ba SwiftUI.

Joale o ka leka ho kenya ts'ebetso le ho phatlalatsa boemo bo bocha. Mona ke mohlala o rarahaneng haholoanyane.

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!]))
            }
        }
    }
}

Khoutung e kaholimo, ke sebelisa ketso ea .onDelete ho tloha SwiftUI bakeng sa IP ka 'ngoe. Sena se lumella mola o lethathamong ho bonts'a swipe e tloaelehileng ea iOS ho hlakola. Kahoo ha mosebelisi a ama konopo ea hlakola, e etsa hore ketso e tsamaisanang le eona e tlose filimi lethathamong.

Leha ho le joalo, kaha thepa ea lethathamo e nkiloe ho boemo ba BindableObject mme e kentsoe joalo ka EnvironmentObject, SwiftUI e ntlafatsa lenane hobane ForEach e amahanngoa le thepa e baloang ea lifilimi.

Mona ke karolo ea "MoviesState reducer":

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
}

Reducer e etsoa ha o romella ketso mme o khutlisa boemo bo bocha, joalo ka ha ho boletsoe ka holimo.

Ha ke sa tla bua ka botlalo - hore na SwiftUI e hlile e tseba seo e lokelang ho se bontša joang. Ho utloisisa sena ka botebo, ho bohlokoa sheba seboka sa WWDC mabapi le phallo ea data ho SwiftUI. E boetse e hlalosa ka ho qaqileng hore na ke hobane'ng ha e sebelisoa le nako efe State, @Binding, ObjectBinding le EnvironmentObject.

Skillbox e khothaletsa:

Source: www.habr.com

Eketsa ka tlhaloso