マガジンのカバー画像

Swiftでいこう!

584
楽しくプログラミング!Swiftはなんだか楽しい"ことば"です。
運営しているクリエイター

2020年12月の記事一覧

SwiftUI Tutorials - Animating Views and Transitions

Add Hiking Data to the App サイトで配布されているデータをダウンロードしてXcodeのResources folderに入れて 使います。 hikeData.json Hikes folder そしてモデルを作っていきます。 Hike.swiftというSwiftファイルを作り、構造体Hikeを作ります。データ構造を記述していきます。Codableなどに対応します。 struct Hike: Codable, Hashable, Identif

SwiftUI Tutorials - Drawing Paths and Shapes-2

Draw the Badge Symbol バッジの中身を作っていきます。ダウンロードしたResourcesからXcodeに取り込みます。 新しいSwiftUIファイルBadgeSymbol.swiftを作ります。 path APIsを使って図形を書きます。 GeometryReader { geometry in Path { path in let width = min(geometry.size.w

SWiftUIでいこう- GeometryReader

チュートリアルをやっていく中で"GeometryReader"というのが出てきました。少し使い方をみていきます。 Viewのサイズを取得する時に使うようです。 以下サイトをXcodeで試してみます。 struct ContentView: View { var body: some View { GeometryReader{geometry in Text("\(Int(geometry.size.width)

SwiftUI Tutorials - Drawing Paths and Shapes

最終的にはリスト内にある場所に行った時にバッジをつけることができるようにします。このチューリアルではそのバッジを作ります。 全体の流れですが、まず、六角形の座標を決め、その背景を作ります。その六角形の中にシンボルとなる形を作り上げ、色を付けて出来上がりです。 Create Drawing Data for a Badge View 新しくHexagonParameters.swiftファイルを追加して構造体"HexagonParameters"を作りデータ構造を定義してお

SwiftUI Tutorials - Handling User Input 2

Use an Observable Object for Storage Favoriteを自由に追加してフィルターで選択できるようにしていきます。操作に対して画面を変更します。いわゆる非同期によるデータ監視を行うために"Combine"で実装していきます。 ModelData.swift の変数"landmarks"を、 import Combinefinal class ModelData: ObservableObject {} と定義し、 var landm

SwiftUI Tutorials - Handling User Input 1

Mark the User’s Favorite Landmarks Favorite、お気に入りに星マークをつけることができるようにします。 Landmark.swift 変数を追加します。これで"isFavorite"のデータを取得できるようにします。 var isFavorite: Bool Jsonファイルには以下のようにデータが入っています。 "name": "Turtle Rock", "category": "Rivers",

SwiftUI Tutorials - Building Lists and Navigation - 2

Pass Data into Child Views 次に詳細画面"LandmarkDetail()"のデータを表のデータ(jsonデータ)を利用して更新できるようにしていきます。 CircleImage.swift 構造体"CircleImage"に変数 var image: Image を追加します。 MapView.swift 構造体"MapView"に変数 var coordinate: CLLocationCoordinate2D を追加します。そ

SwiftUI Tutorials - Building Lists and Navigation - 1

ここではjsonファイルのデータを読み込んで表形式で表示させる仕組み、その表のカラム選択するとで詳細画面に遷移するようにしていきます。 ProjectFilesをダウンロードして"StartingPoint"に入っているファイルを使って進めていきます。 材料として、XcodeのprojectのResourcesにはダウンロードしたフォルダよりjsonファイルとAssets.xcassetsフォルダに写真を取り込んでおくことが必要です。 Modelの作成(Landmark

SwiftUI Tutorials - Creating and Combining Views

SwiftUIが少し新しくなったのに合わせてチューリアルもリニューアルされているようなので、まとめながら実際にコード組んで行きます。 Creating and Combining Views 最初の一歩ですが、プロジェクトの作り方から丁寧に解説してあります。 やりやすいように"project files"ということでダウンロードできるようになっています。ダウンロードすると Complete(完成したもの)とResources(画像など材料)と2つのフォルダが入っているの

SwiftUIでいこう! - 画面遷移を使ったアプリ。

参考サイトを見ながら作りながらまとめて概略的に記録します。基本的な動きは以下のものと同じような感じになります。画面切り替えがスクロールではなくて切り替えるようにします。このアプリの画面切り替えのポイントを記録します。 ライフサイクルを図示してみます。 @mainでの起動して画面を切り替えます。設定画面もあります。 切り替えのポイントとしては ・@main (@AppStorageでの起動時の状態記録)での起動 ・@AppStorageでの状態での画面の切り替え ・Na

SwiftUIでいこう! - @Binding

参考サイトを見ながら自分でも実際に試してみます。まずは @State private var isOn = false @Stateを使ってデータのやりとりがリアルタイムに受け渡しができるかやってみます。ボタン Button(action: {  isOn.toggle() }) {  Image(systemName: "power") } を押すと 文字の"On"と"OFF"が入れ替わります。 Text(isO

SwiftUIでいこう! - ScrollViewを使ったアプリ。

参考サイトを見ながら作っています。まずどんなアプリかというと。 ScrollViewを使って水平方向に画面の切り替えができるというものです。 構造を以下に図示してみました。 表示部分とデータ部分を切り離して、データをテンプレートにいれる形で画面を作っています。 ファイルとしては ContentView.swift ・・・表示部分(実際のデータを表示) CardView.swift ・・・テンプレート CardModel.swift ・・・ データモデル CardD

SwiftUIでいこう! - PencilKit

PencilKitを使って簡単にお絵かきができるアプリが作れてしまいます。 紹介動画を参考にiPadのSwift Playgrounds、MacのPlayground、Xcodeで実行してみます。MacのPlayground、Swift Playgroundsではツールが出ないので、iPadのSwift Playgrounds、Xcodeでやった方がお絵かきできて楽しいです。 Swift Playgroundsで実行するための基本的な追加コードです。 import P