💡 Nový nápad ⚠ Nahlásit chybu
← BuresIndustries SwiftUI editor · živý náhled na virtuálním iPhonu
Připraveno
1

					
				

Struktura

struct ContentView: View s var body: some View. Vlastní podpohledy (další struct s body) můžeš volat i s parametry: DetailView(nazev: "Kafe").

Stav a vazby

@State private var count = 0, obousměrné vazby přes $count (TextField, Toggle, Slider, Stepper, Picker). Podporuji String, Int, Double, Bool i pole.

Rozvržení

VStack HStack ZStack ScrollView List Form Section ForEach Group Spacer Divider TabView NavigationStack NavigationLink.

Prvky

Text Label Image(systemName:) Button TextField SecureField TextEditor Toggle Slider Stepper Picker ProgressView Circle Rectangle RoundedRectangle Capsule Color LinearGradient.

Modifikátory

.font .foregroundColor .background .padding .frame .cornerRadius .clipShape .overlay .shadow .opacity .bold .offset .rotationEffect .buttonStyle .pickerStyle .navigationTitle .tabItem .sheet .alert .onTapGesture .onAppear .disabled.

Vlastní podpohledy

Kus obrazovky si můžeš pojmenovat jako var mojeKarta: some View { … } a pak ho v body použít jako mojeKarta. Funkce mohou vracet hodnoty i barvy: func barva() -> Color { … }.

Logika

if / else, for … in, funkce, print() (píše do konzole), interpolace "Máš \(count) bodů", práce s poli (append, remove(at:), count, isEmpty, contains, shuffled, filter, map), slovníky [String: Int] a Int.random(in:).

Poznámka

Náhled je interpret podmnožiny SwiftUI přímo v prohlížeči — ne skutečný překladač Swiftu. SF Symbols se zobrazují jako nejbližší emoji. Kód si stáhni tlačítkem .swift a v Xcode ho přeložíš doopravdy.

✨ AI pomocník je jen pro přihlášené. Píše kód, opravuje chyby a našeptává při psaní.

Vzory vidí všichni v nabídce Příklady. Každý návrh musí schválit admin — i ten svůj vlastní.

9:41
iPhone 15 Pro · náhled je živý — klikej v něm

📤 Navrhnout do vzorů

Pošleš kód, který máš právě v editoru. Objeví se v nabídce Příklady až ho schválí admin — to platí i pro návrhy od adminů.

AI pomocník je jen pro přihlášené

Píše kód, opravuje chyby a našeptává ti při psaní — jede na Mistral AI, který web platí ze svého. Přihlas se nebo si během chvilky založ účet; je to zdarma, bez reklam a bez předplatného.

Editor, náhled na mobilu i příklady fungují i bez přihlášení.

ⓘ Co iOS Studio umí

Píšeš skutečnou syntaxi Swiftu a SwiftUI — stejnou, jakou bys napsal v Xcode. Náhled vpravo ale není Xcode: je to interpret podmnožiny SwiftUI napsaný v JavaScriptu, který běží přímo v tvém prohlížeči. Nic se neposílá na server a nic se doopravdy nepřekládá.

Ano, píše se to jako ve Swiftu

struct ContentView: View {
    @State private var pocet = 0

    var body: some View {
        VStack(spacing: 12) {
            Text("Klikl jsi \(pocet)×")
                .font(.title)
            Button("Přidej") { pocet += 1 }
                .buttonStyle(.borderedProminent)
        }
        .padding()
    }
}

Struktura struct … : View s var body: some View, stav přes @State, obousměrné vazby přes $promenna, modifikátory tečkovou notací, interpolace \(…). Tlačítkem .swift si kód stáhneš a v Xcode ho přeložíš doopravdy — dokud zůstaneš v podporované podmnožině, zkompiluje se beze změn.

✓ Co umí

  • Rozvržení: VStack, HStack, ZStack, ScrollView, List (i datový), Form, Section, ForEach, LazyVGrid/LazyHGrid s GridItem, Grid, Group, Spacer, Divider, GeometryReader
  • Navigace: NavigationStack, NavigationLink (opravdu listuje tam i zpět) včetně NavigationLink(value:) s .navigationDestination(for:), TabView s .tabItem, .toolbar s ToolbarItem, .searchable
  • Prvky: Text (i Text(datum, style: .time)), Label, Image(systemName:), Button, Menu, TextField, SecureField, TextEditor, Toggle, Slider, Stepper, Picker, DatePicker, ColorPicker, Gauge, ProgressView, LabeledContent, Link
  • Tvary a barvy: Circle, Rectangle, RoundedRectangle, Capsule, Ellipse, vlastní Shape s Path (move/addLine/addCurve/addArc), Canvas s fill/stroke/draw, Color, Linear/Radial/AngularGradient, materiály (.ultraThinMaterial)
  • Modifikátory: font, foregroundColor/Style, background, padding, frame, cornerRadius, clipShape, overlay, shadow, border, opacity, offset, position, rotationEffect, rotation3DEffect, scaleEffect, blur, saturation, brightness, contrast, grayscale, blendMode, badge, buttonStyle, navigationTitle, disabled, safeAreaInset
  • Animace: .animation(.easeInOut(duration:), value:) a withAnimation { … } — změna stylu proběhne plynule
  • Okna a události: .sheet (podle isPresented: i item:, s .presentationDetents), .fullScreenCover, .alert, .confirmationDialog, .contextMenu, .onTapGesture, .onAppear, .onChange(of:), .task
  • Gesta: .gesture(DragGesture().onChanged { … }.onEnded { … }) — prvkem jde opravdu táhnout myší i prstem
  • Seznamy: .onDelete a .swipeActions u ForEach — položky jdou opravdu mazat; TimelineView se překresluje sám
  • Telefon: UIDevice.current (baterie, model, systém), UIScreen.main.bounds, ProcessInfo.processInfo, CLLocationManager pro polohu, PhotosPicker pro fotku z galerie a UIApplication.shared.open pro odkazy a zkratky
  • Hlas a sdílení: AVSpeechSynthesizer přečte text nahlas (i česky) a ShareLink pošle výsledek dál — systémovým sdílením, jinak do schránky
  • Jazyk: if/else, if let, guard, switch se vzory a where, for-in (i s n-ticí a where), while, repeat-while, stride, funkce s návratovou hodnotou i výchozími parametry, closure včetně $0
  • Typy: struct modely s init, class a ObservableObject s @Published, enum (rawValue, CaseIterable, asociované hodnoty), extension, statické členy, n-tice, optionaly
  • Stav: @State, @Binding, @StateObject, @ObservedObject, @EnvironmentObject, @Environment(\.dismiss) a @AppStorage("klic"), které přežije i restart náhledu
  • Knihovna: String, Array, Set, Dictionary, Date, matematika, Int.random(in:), zip, Timer.scheduledTimer, DispatchQueue.main.asyncAfter, Task { }, print() do konzole
  • Vlastní pohledy: další struct … : View s parametry, var kus: some View { … } i func radek(…) -> some View

✕ Co zatím neumí

  • Složitější animace.animation a withAnimation plynule přejedou velikost, barvu, posun či průhlednost; pružiny a matchedGeometryEffect ale zjednodušuji
  • Jazyk: protokoly s implementací, generika, async/await (běží hned, nečeká), chyby přes throw
  • Okolní svět: síť (URLSession), soubory, UserDefaults — data žijí jen do restartu náhledu
  • Přesné kreslení: matchedGeometryEffect, přechody mezi obrazovkami, animované pružiny
  • Systémové: Map, kamera, notifikace, WidgetKit, Charts, HealthKit
  • React Native / JSX — tohle je editor Swiftu, ne JavaScriptu

Přístup k telefonu — co je skutečné a co ne

Náhled běží v prohlížeči, takže si půjčuje to, co prohlížeč nabídne, a zbytek poctivě simuluje. Píše se to skutečnými názvy z iOS, aby se stažený .swift dal přeložit v Xcode.

PolohaCLLocationManager().requestLocation() se zeptá prohlížeče na skutečnou polohu. Když ji odmítneš nebo prohlížeč nemůže, dostaneš simulovanou Prahu a v konzoli je o tom poznámka (misto.simulated ti to řekne i v kódu).
BaterieUIDevice.current.batteryLevel čte skutečný stav tam, kde to prohlížeč umí (Chrome a Edge); jinde vrátí věrohodnou hodnotu.
GaleriePhotosPicker otevře výběr souborů, takže si vybereš opravdovou fotku z počítače nebo telefonu. Fotka se nikam neposílá, zůstává v prohlížeči.
HodinyDate(), Timer i TimelineView jdou podle skutečného času.
Model a displejUIDevice.current.name a UIScreen.main.bounds hlásí ten telefon, který máš vybraný nahoře v liště.
HlasAVSpeechSynthesizer mluví přes hlasový výstup prohlížeče. Český hlas mají Windows, macOS i Android; když ho prohlížeč nemá, přečte text výchozím hlasem a napíše to do konzole.
SdíleníShareLink otevře systémové sdílení na mobilu; na počítači místo něj zkopíruje text do schránky a napíše o tom přes obrazovku.
Zkratky a odkazyUIApplication.shared.open nic neotevře, ale napíše přes obrazovku, co by se na skutečném telefonu stalo (třeba spuštění zkratky shortcuts://run-shortcut?name=…).

V čem se náhled liší od skutečného iPhonu

SF Symbols nemám k dispozici, takže Image(systemName:) kreslím nejbližším emoji.
Rozvržení se přepočítává do CSS, takže se může o pár pixelů lišit od Xcode.
Data se neukládají — po tlačítku Restart nebo změně kódu začíná aplikace znovu.
• Když použiješ něco, co neznám — neznámý prvek, funkci, metodu i překlep v názvu proměnné — napíšu to do konzole jako varování a zbytek běží dál.
Data z @AppStorage zůstávají v prohlížeči i po restartu náhledu; ostatní stav se vynuluje.

AI pomocník

V panelu ✨ AI dole napíšeš česky, co má aplikace dělat, a Mistral Codestral (stejné API, jaké pohání autonomní blog a Knihu dobrých zpráv) ti napíše SwiftUI kód rovnou do editoru. Umí taky opravit chybu podle hlášky z konzole a vysvětlit kód. Při psaní ti navíc našeptává — návrh se ukáže šedě za kurzorem, Tab ho přijme, Esc zahodí, Ctrl+mezerník si ho vyžádá ručně. Našeptávání se dá vypnout zaškrtávátkem v panelu. AI je jen pro přihlášené a model dostává seznam toho, co náhled umí, aby psal kód, který tady opravdu poběží.

Vzory od ostatních

V nabídce Příklady najdeš vedle vestavěných i vzory, které navrhli ostatní. Svůj projekt tam můžeš poslat taky — v panelu Projekty je tlačítko Navrhnout tenhle kód do vzorů. Každý návrh musí schválit admin, i když ho podal admin sám.

Jak se kód spouští

Náhled běží živě — po každé úpravě se sám překreslí (asi 0,4 s po tom, co dopíšeš), takže výsledek vidíš rovnou. Spustit přeloží kód odznova a zároveň vynuluje stav aplikace (počítadla, texty, obrazovky). Zastavit živý běh vypne: mobil zešedne, přestane reagovat a nic se nepřekresluje, dokud nedáš Spustit. Když se kód zacyklí a překresloval by se donekonečna, zastavím ho sám a napíšu to do konzole.

Zkratky

Ctrl+Enter — spustit odznova Ctrl+S — uložit projekt Tab — odsazení Esc — zavřít tuto nápovědu
Náhled je živý — klikej v něm na tlačítka, piš do polí, přepínej a listuj do detailu. Kód se překresluje sám ~0,4 s po tom, co dopíšeš.
Verze studia: 1785931665
💡 Nový nápad
⚠ Nahlásit chybu