Uphuhliso lwesicelo kwi-SwiftUI. Icandelo 1: I-Dataflow kunye ne-Redux

Uphuhliso lwesicelo kwi-SwiftUI. Icandelo 1: I-Dataflow kunye ne-Redux

Emva kokuzimasa iseshoni yeState of the Union kwiWWDC 2019, ndaye ndagqiba kwelokuba ndingene nzulu kwiSwiftUI. Ndichithe ixesha elininzi ndisebenza nayo kwaye ngoku sele ndiqalile ukuphuhlisa isicelo sokwenyani esinokuba luncedo kuluhlu olubanzi lwabasebenzisi.

Ndiyibize ngokuba yiMovieSwiftUI- olu lusetyenziso lokukhangela iifilimu ezintsha nezindala, kunye nokuziqokelela kwingqokelela usebenzisa. TMDB API. Bendihlala ndizithanda iifilimu kwaye ndaze ndadala inkampani esebenza kweli candelo, nangona kwakudala. Inkampani ayinakubizwa ngokuba ipholile, kodwa isicelo sasiyiyo!

Siyakhumbuza: kubo bonke abafundi be "Habr" - isaphulelo se-ruble ye-10 xa ubhalisa kuyo nayiphi na ikhosi ye-Skillbox usebenzisa ikhowudi yokuphromotha "Habr".

I-Skillbox iyacebisa: Isifundo esikwi-intanethi "UmSebenzi weJava woMsebenzi".

Ke yintoni enokuyenza i-MovieSwiftUI?

  • Isebenzisana ne-API - phantse naluphi na usetyenziso lwangoku lwenza oku.
  • Ilayisha idatha ye-asynchronous kwizicelo kwaye yahlulahlula i-JSON kwimodeli ye-Swift isebenzisa Codable.
  • Ibonisa imifanekiso elayishiweyo kwaye igcinwe kwi-cache.
  • Le app ye-iOS, i-iPadOS, kunye ne-macOS ibonelela ngeyona UX ibalaseleyo kubasebenzisi bezi OS.
  • Umsebenzisi unokuvelisa idatha kwaye enze uluhlu lwabo bhanyabhanya. Isicelo sigcina kwaye sibuyisela idatha yomsebenzisi.
  • Ukujonga, amacandelo kunye neemodeli zahlulwe ngokucacileyo kusetyenziswa ipateni ye-Redux. Ukuhamba kwedatha apha akubhekiseli ngakunye. Inokugcinwa ngokupheleleyo, ibuyiselwe kwaye ibhalwe ngaphezulu.
  • Isicelo sisebenzisa amacandelo asisiseko eSwiftUI, iTabbedView, SegmentedControl, NavigationView, Form, Modal, njl. Ikwabonelela ngeembono zesiko, izijekulo, i-UI/UX.

Uphuhliso lwesicelo kwi-SwiftUI. Icandelo 1: I-Dataflow kunye ne-Redux
Ngapha koko, oopopayi bagudile, i-GIF yajika yaba yinto encinci

Ukusebenza kwi-app kundinika amava amaninzi kwaye iyonke yayingamava alungileyo. Ndakwazi ukubhala isicelo esisebenza ngokupheleleyo, ngoSeptemba ndiya kuyiphucula kwaye ndiyipapashe kwi-AppStore, ngaxeshanye nokukhululwa kwe-iOS 13.

Redux, BindableObject kunye ne-EnvironmentalObject

Uphuhliso lwesicelo kwi-SwiftUI. Icandelo 1: I-Dataflow kunye ne-Redux

Ndisebenze neRedux malunga neminyaka emibini ngoku, ngoko ke ndiyazi kakuhle kuyo. Ngokukodwa, ndiyisebenzisa kwi-frontend ye usabela website, kunye nokuphuhlisa iOS zomthonyama (Swift) kunye Android (Kotlin) izicelo.

Andizange ndizisole ngokukhetha i-Redux njengolwakhiwo lokuhamba kwedatha yokwakha isicelo se-SwiftUI. Awona macandelo acela umngeni xa usebenzisa i-Redux kwi-app ye-UIKit asebenza kunye nevenkile kwaye afumane kwaye afumane kwakhona idatha kwaye ayenze imephu kwiimbono zakho / amacandelo. Ukwenza oku, kwafuneka ndenze uhlobo lwethala leencwadi lokudibanisa (usebenzisa iReSwift kunye neReKotlin). Isebenza kakuhle, kodwa ikhowudi eninzi kakhulu. Ngelishwa, ayika (okwangoku) umthombo ovulekileyo.

Iindaba ezimnandi! Ekuphela kwezinto onokuzikhathaza ngazo nge-SwiftUI- ukuba uceba ukusebenzisa i-Redux- ziivenkile, amazwe, kunye nabanciphisi. Ukusebenzisana nevenkile kuhoywe ngokupheleleyo nguSwiftUI enkosi @EnvironmentObject. Ke, ivenkile iqala ngeBindableObject.

Ndenze iphakheji ye-Swift elula, I-SwiftUIFlux, ebonelela ngokusetyenziswa okusisiseko kweRedux. Kwimeko yam yinxalenye ye-MovieSwiftUI. Mna nam wabhala isifundo senyathelo nenyathelo, eya kukunceda usebenzise eli candelo.

Isebenza njani?

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

Ngalo lonke ixesha uvula intshukumo, uvula ibhokisi yegiya. Iya kuvavanya izenzo ngokwemeko yangoku yesicelo. Emva koko iya kubuyisela imeko entsha elungisiweyo ngokuhambelana nohlobo lwesenzo kunye nedatha.

Ewe, kuba ivenkile iyiBindableObject, iyakwazisa iSwiftUI xa ixabiso layo litshintsha usebenzisa ipropathi ye willChange enikezwe yiPassthroughSubject. Oku kungenxa yokuba i-BindableObject kufuneka ibonelele ngoHlobo loMpapashi, kodwa ukuphunyezwa kweprotocol kunoxanduva lokuyilawula. Ngokubanzi, esi sisixhobo esinamandla kakhulu esivela kwi-Apple. Ngokufanelekileyo, kumjikelo olandelayo wonikezelo, i-SwiftUI iya kunceda ukunika umzimba wezimvo ngokotshintsho lukarhulumente.

Ngokwenyani, le yintliziyo kunye nomlingo weSwiftUI. Ngoku, kuyo nayiphi na imbono ebhalisa kwisimo, imbono iya kunikezelwa ngokuhambelana nokuba yeyiphi idatha efunyenwe kurhulumente kwaye yintoni etshintshileyo.

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

IVenkile itofwe njengeEnvironmentObject xa isicelo siqala kwaye sifikeleleke kuyo nayiphi na imboniselo usebenzisa @EnvironmentObject. Akukho sohlwayo sokusebenza kuba iipropati ezifunyenweyo zifunyanwa ngokukhawuleza okanye zibalwe kwimeko yesicelo.

Ikhowudi engentla iyawutshintsha umfanekiso ukuba ipowusta yemuvi iyatshintsha.

Kwaye oku kwenziwa ngomgca omnye kuphela, ngoncedo lweziphi iimbono eziqhagamshelwe kurhulumente. Ukuba usebenze ngeReSwift kwi-iOS okanye nokuba xhuma ngeReact, uya kuqonda umlingo weSwiftUI.

Ngoku ungazama ukuvula intshukumo kwaye upapashe imeko entsha. Nanku umzekelo ontsonkothileyo.

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

Kule khowudi ingasentla, ndisebenzisa i-.onDelete intshukumo evela kwi-SwiftUI kwi-IP nganye. Oku kuvumela umqolo kuluhlu ukubonisa i iOS eqhelekileyo swayipha ukucima. Ke xa umsebenzisi echukumisa iqhosha lokucima, ibangela isenzo esihambelanayo kwaye isuse imuvi kuluhlu.

Ewe, kuba uluhlu lwepropathi luthatyathwe kwimeko ye-BindableObject kwaye ifakwe njenge-EnvironmentalObject, i-SwiftUI ihlaziya uluhlu kuba i-ForEach inxulunyaniswa nepropathi ebalwa bhanyabhanya.

Nantsi inxalenye ye-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
}

Umnciphisi wenziwa xa uthumela isenzo kwaye ubuyisela imeko entsha, njengoko kuchaziwe ngasentla.

Andizukungena kwiinkcukacha okwangoku-indlela i-SwiftUI eneneni eyazi ngayo into emayibonise. Ukuqonda oku ngokunzulu, kuyafaneleka jonga iseshoni yeWWDC ekuhambeni kwedatha kwi-SwiftUI. Ikwachaza ngokweenkcukacha ukuba kutheni kwaye nini ukusetyenziswa imeko, @Binding, ObjectBinding kunye ne-EnvironmentalObject.

I-Skillbox iyacebisa:

umthombo: www.habr.com

Yongeza izimvo