#swift
Design an interface - SwiftUI でプログラミング - 2
Create the features page
もう一つページを作っていきます。アプリの機能を説明するカードのリストを作ります。整理するために、ページ本体用とカード用の画面2 つを作成します。
まず、新規ファイルFeaturesPageを作って、
import SwiftUIstruct FeaturesPage: View { var body: some View {
Design an interface - SwiftUI でプログラミング - 1
画面のデザインについてのチュートリアルです。画面に表示させるレイアウトを順を追って作っていきます。
2 つの画面を作成して、ビューを配置してレイアウトしていきます。 コードを書いて、好きなレイアウト、色、グラフィック、テキストをいれていきます。
Create the welcome page
新しいプロジェクトを作るとContentViewが出来上がりますが、今回は2つの画面を作っていくので
Customize views - SwiftUI でプログラミング - 2
Use Int to display temperatures
Text("Mon")以外に最高気温と最低気温の表示をするためにText()が使われているところが2箇所あるので追加します。
数値が入るのでそのままでは表示することはできないので、文字に変換して表示できるようにします。
まずはプロパティ（変数）を追加します。
型が"Int"(整数)であることに注目します。このままText()に
Customize views - SwiftUI でプログラミング - 1
Create a new project
新しいプロジェクトを作ります。前回と同じようにSwiftPlaygroundsで作ります。
Prototype a forecast view
目指すものは
こんな感じなもの作っていきます。同じようなパーツが組み合わせてあることに注目します。
まず簡単に文字だけで天気予報を表示させます。
Text("Mon")Text("High: 70")T
Hello! - SwiftUI でプログラミング。 - 2
Edit code and make mistakes
真ん中のエディタ部分をいじっていきます。色々変更してみます。
"Hello, world"部分を変えてみます。
実行してみるとプレビュー画面で文字が変わったのが確認することができます。
この部分を消した時は文字が消え、括弧を片方消した時は
というエラー表示されることを確認します。このエラーは
文字を囲む括弧の最後の""がないことを
Hello! - SwiftUI でプログラミング。 - 1
アップルが公開しているチュートリアルです。すごく丁寧に解説してありますが英語なので少し説明を加えてみます。
今回はXcodeを使わずSwiftPlaygrounds でやってみようと思います。SwiftPlaygroundsはiPadとMacで無料でダウンロードできます。
さっそく順番にやっていきます。
Create a new project
ここではまずプロジェクトを作っていきます。が
SwiftUIでじゃんけん！
じゃんけんゲームをSwiftUIで組み上げてみましょう！GoogleのGeminiを使って考えてもらい少し修正して使えるように調整します。
iPad,MacのSwiftPlaygroudsで実行できます。
Geminiに「swiftuiでじゃんけんを作って」とお願いして出してきたコードの回答案3を使うと
struct ContentView: View { @State privat
SwiftUIのチュートリアルを試す(Save data )
基本的な構造を作って行きます。まず表示するデータの内容を決めます。以下、名前と誕生日。新規ファイルを作りコードを書いて行きます。
import Foundationstruct Friend { let name: String let birthday: Date }
作ったデータを表示する部分を作ります。
import SwiftUIstruct ContentView:
SwiftUIのチュートリアルを試す(List)
リストの基本は
VStack { List { Text("Elisha") Text("Andre") Text("Jasmine") Text("Po-Chun") } }
これを一括で表示できるようにします。
SwiftUIのチュートリアルを試す(Button) - 3
さらにサイコロを追加できるようにして、レイアウトも整えて行きます。
Button("Add Dice") { numberOfDice += 1 } .disabled(numberOfDice == 5)
実行すると崩れます。
これを綺麗にするには
DiceView()を編集します。
SwiftUIのチュートリアルを試す(Button) - 2
ContentViewに表示してもっと動的にサイコロを使えるようにして行きます。
struct ContentView: View { var body: some View { Text("Hello") }}
のText()を
VStack { Text("Dice Rolle
SwiftUIのチュートリアルを試す(Button) - 1
新しいチュートリアルの面白そうなものをピックアップしてSwift Playgroundsで実際にコードを書いて実行してみたいと思います。
Chapter 4 "Buttons and state"
ボタンを押してサイコロを振る動作を実装、デザインしています。
最初にサイコロを振って数字を出す構造体を作ります。
struct DiceView: View { var numb
SwiftUIでいこう - もっと Map
Paul Hudsonさんの動画
Integrating MapKit with SwiftUI – Bucket List SwiftUI Tutorial 4/12
を参考に書いて実行します。
import SwiftUIimport MapKitstruct ContentView: View { var body: some View { Map(interacti
SwiftUIのチュートリアルまとめ。 2024.04.02
アップルが開発者に向けてSwiftUIでアプリを作る方法、チュートリアルを新たに発表しましたので紹介します。
と大きく分けて３つのカテゴリーで分けてあり、それぞれを見ていくと、
SwiftUI foundations
ここではSwiftUIでアプリを作るときに必要なことから、基本的な構造まで解説してあります。5つのパートで書かれています。
Data modeling
ここではデータを保持