- 1. WidgetKitで天気予報アプリ作ってみた〜位置情報取得&保存編〜
- 2. 50行で目線トラッキング(iPhone)
- 3. iOSアプリの検索ビューにおけるタグ(UISearchToken)の追加
- 4. UITextViewに入力されている文字数をカウントする
- 5. WidgetKitで天気予報アプリ作ってみた〜天気情報取得編〜
- 6. Xcode 13.3 – アプリ内課金でApp Store にコンテンツをホストする機能が廃止された
- 7. 【Swift×AWS】iOSアプリにAPI Gatewayを導入してCognitoから指定のユーザーデータを消去する
- 8. 画像をコラージュする
- 9. スマホアプリ クロスプラットフォーム開発 in Flutter
- 10. iOS版SafariでGreasemonkey(クライアントサイドスクリプト実行)っぽいことをする
- 11. CocoaPodsの公式ページを読みながら初期設定をまとめる
- 12. [SwiftUI]初めてのCloud Firestore[SPM]
- 13. 【Flutter】そのおじさん、オーバーフローしてませんか?
- 14. 【iOS×Firebase】自動ログイン機能の実装方法
- 15. 【iOS×Firebase】リモートプッシュ通知の実装方法
- 16. 【SwiftUI】Listを作成する
- 17. Chartsでレーダーチャートを出す時にハマったこと
- 18. パーミッションを要求するためアプリの設定画面へ飛ばす【Swift/Kotlin】
- 19. 「The Ultimate Guide to WKWebView」をSwiftUIで実装する – Making a web view fill the screen –
- 20. ARの魔法を手に入れるーーARオブジェクトを指で移動・拡大・回転する方法
WidgetKitで天気予報アプリ作ってみた〜位置情報取得&保存編〜
## 投稿の経緯
前回投稿した[WidgetKitで天気予報アプリ作ってみた〜天気情報取得編〜](https://qiita.com/nkekisasa222/items/359192455b65fb60705d)の続編です。
今回は位置情報を取得して保存するところまでを記事にしようと思います。前回の記事を見てない方は先に↓こちら↓を確認してください。
https://qiita.com/nkekisasa222/items/359192455b65fb60705d
## 開発環境
Swift 5.5
Xcode 13.2.1## サンプルプロジェクト
GitHubにPushしています。気になる方はご覧ください。
https://github.com/ken-sasaki-222/WeatherWidget
![QR_615642.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/643372/8c43013f-9757-f7dd-5946-2684f30f63b7.png)## 位置情報取
50行で目線トラッキング(iPhone)
![Xcode-13.1](https://img.shields.io/badge/Xcode-13.1-brightgreen) ![Swift-5.5.1](https://img.shields.io/badge/Swift-5.5.1-brightgreen) ![iOS-15.1](https://img.shields.io/badge/iOS-15.1-brightgreen)
## はじめに
こちらの記事を見て目線トラッキングが面白そうだなと思いました。
[目線でブラウザをスクロールするアプリを作ってみた](https://dev.classmethod.jp/articles/eye-scrollable-web-view/)調べてみると 50 行くらいで下記ができました(動作確認は iOS 15.1 の iPhone 12 mini)。
目線トラッキングができてるようなできてないような?
コード量50行! iOSアプリの検索ビューにおけるタグ(UISearchToken)の追加iOSの検索ビュー内でタグを追加し、検索対象のカテゴリーを指定することができます。
このタグは検索トークンと呼ばれるものです。
ここでは、検索トークンを作成し、それを検索バーに追加する方法を説明します。 さらに、SwiftUIアプリに検索トークンを使った検索バーを加えることについても説明します。
## サーチトークンの作成
`UISearchToken`プロパティを使用し、サーチトークンを作成することができます。このオブジェクトは、`UIImage`アイコンやタイトルで初期化することができます。
[Apple Developer Documentation](https://developer.apple.com/documentation/uikit/uisearchtoken)
また、トークンの識別子を指定す
UITextViewに入力されている文字数をカウントする
TextViewに入力されている文字数のリアルタイムカウントを実装します。
文字列中の全ての空白や改行はカウントしません。環境
—* Xcode 13.2.1
* Swift 5.5.2手順
—StringProtocolを拡張します。
“`Swift:Extension.swift
extension StringProtocol where Self: RangeReplaceableCollection {
var removeWhitespacesAndNewlines: Self {
filter { !$0.isNewline && !$0.isWhitespace}
}
}
“`使用例
—“`Swift:ViewController.swift
extension ViewController: UITextViewDelegate {
func textViewDidChange(_ textView: UITextView) {
let textLength = textView.te
WidgetKitで天気予報アプリ作ってみた〜天気情報取得編〜
## 投稿の経緯
最近仕事でウィジェットをよく触っており、復習とアウトプットを兼ねて天気予報アプリを開発しているので記事にしました。
今回使う天気情報は**OpenWeatherMap**の**OneCallAPI**から取得します。https://openweathermap.org/
## 開発環境
Swift 5.5
Xcode 13.2.1## サンプルプロジェクト
GitHubにPushしています。気になる方はご覧ください。
https://github.com/ken-sasaki-222/WeatherWidget
![QR_615642.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/643372/8c43013f-9757-f7dd-5946-2684f30f63b7.png)## APIを叩いてみる
“`
{
“lat”: 33.44,
“lon”: -94.04,
“timezone”: “America/Chicago”,
“timezone_of
Xcode 13.3 – アプリ内課金でApp Store にコンテンツをホストする機能が廃止された
# おさらい
アプリ内課金コンテンツのホスト機能とは、非消費型プロダクトがコンテンツを持つ場合、それをアプリ内にバンドルするのではなく、App Storeサーバに置かせてもらう機能です。
アプリ本体のサイズを小さくし、購入したコンテンツだけを必要に応じてダウンロードさせる仕組みです。StoreKitフレームワークに属します。
アプリのバイナリとは別に、アプリ内課金コンテンツもバイナリとして生成する必要があり、生成したバイナリは Xcode Organizer経由でアップロードする必要がありました。# 廃止になった
[Xcode 13.3 beta リリースノート](https://developer.apple.com/documentation/xcode-release-notes/xcode-13_3-release-notes)を見ていたらさらっとサポート終了と書かれてました。
> Building and uploading nonconsumable in-app purchase content for Apple to host is no longer supp
【Swift×AWS】iOSアプリにAPI Gatewayを導入してCognitoから指定のユーザーデータを消去する
## 前提
ユーザーの退会機能を作るべく、今までAmplifyを使用していたアプリにAPI Gatewayを追加したサーバレスアプリです。
Amplifyからユーザーの削除APIがあればよかったのですが見つからずで、Lambdaから実現することに。(もしAmplifyからのやり方を知っている人がいたら教えてください笑)
元々はLambdaが使えれば良く、どうやらLambdaを直叩きする方法もあるっぽいんですが、API Gatewayを触ったことがなかったのでそちらを使って実装してみることにしました。
また、今回初めてAPI Gatewayを触るので、とりあえずリクエストだけ実装してレスポンスはデフォルトです。
実装が甘いところ等もあると思いますがご容赦ください。## 構成
構成はこんな感じ。これをAlamofireを使って叩いていきます。![Untitled Diagram.drawio (1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/653537/f13f392c-f203-42da-4
画像をコラージュする
#画像を組み合わせて一枚の画像を作る方法です
#複数の画像から新しい画像を作りたい
複数の画像を組み合わせて一枚の画像にするとなると、はて、どうすればいいのか、、、と改めて思いました。#Contextに描画すればいい
“`swift
UIGraphicsBeginImageContextWithOptions(CGSize(width: outputWidth, height: outputHeight), false, 0.0)imageA.draw(in: drawRectA)
imageB.draw(in: drawRectB)
imageC.draw(in: drawRectC)let assembledImage = UIGraphics
スマホアプリ クロスプラットフォーム開発 in Flutter
# Index
1.Flutterフレームワーク
2.AndroidStudioで開発できる
3.UIの記載はネストを多用する
4.UIとビジネスロジックを分けて書く
5.KotlinとSwiftによる書き分けが必要な場合がある
6.Dartプログラムのエントリーポイント
7.使用パッケージの宣言
8.ホットリロードで一回一回ビルドしなくてもいい
9.動作確認
10.アプリ公開## 1.Flutterフレームワーク
2018年12月にGoogleからリリースされた、モバイルアプリ開発用のフレームワーク。#### Dart言語
従来ならば、AndroidならKotlin
iOSであればSwift
という、それぞれの言語を覚えなければいけないがFlutterの場合は、DartというJavaライクな言語を覚えるだけで
両方の開発ができ、学習コストを抑えることができる。## 2.AndroidStudioで開発できる
##### AndroidStudioのインストール
![スクリーンショット 2022-01-20 20.56.23.png](https://qiita-im
iOS版SafariでGreasemonkey(クライアントサイドスクリプト実行)っぽいことをする
# はじめに
iOSのショートカットでJavaScriptが実行できるのを知ってますか?
ググってみたんですがショートカットがいまいち周知されてないのもあって
あまり知られていない機能のような気がします。ショートカットって何?という方
→https://time-space.kddi.com/mobile/20191120/2783JavaScriptが実行できるということは・・・
なんでも!
やれるということ!つまりかつて人気だったGreasemonkey(ユーザスクリプトによる拡張機能)が
工夫次第でっぽいものが再現可能です。Greasemonkeyって何?という方
https://ja.wikipedia.org/wiki/Greasemonkey今回は簡単にCSSを自由に変更する例をご紹介します。
QiitaトップページのQiitaロゴを消してみましょう!# 環境
– iPhone SE2
– iOS 15.1
– Safari# ショートカットの作成
まずはアプリのショートカットを起動します。![IMG-3406.PNG](https://q
CocoaPodsの公式ページを読みながら初期設定をまとめる
タイトルの通りios開発時には使い方やエラーは調べてることがほとんどで、
そもそもCocoaPodsとはというものは調べたことが無かったため
公式ページを調べてまとめてみようという記事です。基本的には下記の公式ページを翻訳などしてみていこうと思います。
https://cocoapods.org/##そもそもCocoaPodsとは
– とりあえずの認識
Xcodeのプロジェクトでライブラリの追加、バージョン管理ができるもの
– 公式ページを翻訳
![about.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/636051/b4da4b4f-b174-3ed8-f73a-5ee612abe16b.png)
機械翻訳するとやっぱりニュアンスが怪しいが大体は認識通りそう
というかもしかして他に説明が見当たらない?とりあえず次に初期設定を見てみる
##Podsを使うための初期設定
– macのターミナルからCocosPodsをインストールす
[SwiftUI]初めてのCloud Firestore[SPM]
## 記事の内容
[Firebase Authenticationで認証機能を実装する方法](https://qiita.com/yuujioka/items/d3b310e0a3fa2ddfab5a)に引き続き、Firestoreについてもまとめてみました。
ベースはSPMでの導入後を想定した記事になっています。内容としては以下の通りです。・Cloud Firestoreとは
・データの追加
・データの取得
・データの更新
・データの削除この記事を読む前にFirebaseへの登録やFirebase Authenticationを利用して認証機能を実装する方法はざっと知っておく必要があります。
認証機能については[Firebase Authenticationで認証機能を実装する方法](https://qiita.com/yuujioka/items/d3b310e0a3fa2ddfab5a)にSPMで実装する方法を記載しましたので参考にしていただけると幸いです。## 環境
・ macOS: Monterey
・ Xcode: 13.1
・ SDK Version: iOS
【Flutter】そのおじさん、オーバーフローしてませんか?
# プロローグ
Flutterの勉強を始めて1ヶ月。
Aさんの元についに初めての案件が!**「おじさんが痩せたり太ったりするモバイルアプリ作成」**
仕様を見ると、
**「スクロールなしの1画面に文字とボタンとおじさんの画像を表示するだけ」**
らしい。簡単そうだったので、Aさんは早速作業開始!
意気揚々に作り始めて30分。Aさん 「できました!」
と自信満々にクライアントに見せる。 g早速 **iPhone13** で確認作業が始まる。
クライアント 「うん、いい感じ!SafeAreaの対応もばっちりだし!!」
…でも、 **iPhoneSE 第一世代で確認すると、あららら?**
#はじめに
一度ログインしたらログイン状態を保持しておいてくれるスマホアプリは一般的ですが、
都度トークンの確認などをしているのかなと思い、面倒臭そうだなと思っていました。しかし、Firebaseではこんなに簡単に記述できるのだと思い、めっちゃ便利だと個人的に感動したので備忘録として記述します。
#前提条件
FirebaseAuthを使ったログイン機能は実装している前提として記述しています。#自動ログイン
自動ログインのコードを下記します。
アプリ起動時のSceneDelegateでユーザーのログイン状態を確認しています。“`swift:SceneDelegate.swift
func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
autoLogtin()
}//MARK: – Autologin
func autoLogtin(){
//アタ
【iOS×Firebase】リモートプッシュ通知の実装方法
#はじめに
FirebaseのCloudMessagingを使ったiOSでのリモートプッシュ通知の実装方法に関して、証明書の作製などなかなか手こずったので画像多めで(Qiita的にどうなの)記載していきます。
Firebase見習いなので、間違っている箇所などあればご指摘ください。#必要要件
・Apple Developer Programへの登録(99ドル/年):APN証明書の作製に必要
・Firebaseへのアプリの登録
前提として上記が完了しているものとして記載します。#そもそもFirebaseからどうやってiPhoneにメッセージを送っているのか?
iPhoneにリモートでメッセージを送るのはAPNs(ApplePushNotificationservice)という仕組みを使っています。
これはAppleのサーバー(APNsサーバー)からリモート通知を送る仕組みです。外部サーバー(今回はFirebase)からプッシュ通知を送るためには、アプリに紐づけられたAPNs証明書が必要になります。
そのためAPNs証明書を外部サーバーに登録する必要があります。
ここで外部サー
【SwiftUI】Listを作成する
#環境
Xcode 13.2.1
Swift 5.5.2#Listとは
SwiftUIでは、これまでのUIKitのUITableViewやUICollectionViewを用いたリスト表示を実装したい場合は、`List`を使うことで再現ができます。
Listも表示が画面からはみ出た範囲をスクロールできるようになっています。
一番シンプルにListを用いた静的リストの実装は以下になります。Listも表示が画面からはみ出た範囲をスクロールできるようになっています。“`swift
var body: some View {
List {
Text(“First Item”)
Text(“Second Item”)
Text(“Third Item”)
}
}
“`## 概要
Chartsを使ってレーダーチャートを描画するときに、Y軸に表示される目盛りの個数が合わなくて一生悩んだので備忘録として残しておきます。
結論からいうと、Y軸ラベルの個数が固定の時は `yAxis.setLabelCount(:force:)` を使いましょう。## やりたいこと
– 5種類のデータを表示したい
– 表示したいデータは全て 0 ~ 100 の範囲内
– 目盛りには0 ~ 100 までの値を20ずつ区切った値(0, 20, 40, 60, 80, 100)を出す
– データは後から更新されることがある## 実装してみる
大部分を端折ってますが、設定周りはこんな感じに。“`swift
let chartView = RadarChartView()// 共通設定
chartView.legend.enabled = false // 凡例無効化
chartView.highlightPerTapEnabled = false // タップ無効化
chartView.rotationEnabled = false // 回転無効化
chart
パーミッションを要求するためアプリの設定画面へ飛ばす【Swift/Kotlin】
# はじめに
Android、iOSに限らず、アプリがBluetoothやカメラを利用する際にはユーザがその権限を許可する必要があります。
許可を求めるポップアップが表示され、そこで「許可する」「許可しない」をユーザが選択します。
「許可する」が選択された場合は特に問題ありませんが、「許可しない」が選択された場合は、もう一度許可を求めたり、設定画面から許可するように促す必要があります。設定画面から許可を促すために設定画面へ飛ばすコードを以下に記述します。
# iOS
以下のコードでアプリの設定画面へ飛ばすことができます。
“`.swift
if let url = URL(string: UIApplication.openSettingsURLString) {
UIApplication.shared.open(url, options: [:], completionHandler: nil)
}
“`以下の画面に飛び、権限の許可ができます。
![名称未設定3.jpg](https://qiita-image-store.s3.ap-northeas
「The Ultimate Guide to WKWebView」をSwiftUIで実装する – Making a web view fill the screen –
最近入っていたプロジェクトでWebViewに関して本当に色々なタイプの実装をしました。
何年も改修を繰り返して様々な外部システムとの連携が必要だったということもあるでしょう。
色々ありましたが、自分のキャリア的には大きな影響を与えてくれました。(なぜかここで感謝)とそんな時に
Hacking with Swiftで[「The Ultimate Guide to WKWebView」](https://www.hackingwithswift.com/articles/112/the-ultimate-guide-to-wkwebvie)という何やら良さげなページを発見。見てみると、結構これやったな。
あ、他にもこんなことできるんだ、という学びになりました。おさらいがてらそれを振り返りつつ、
**SwiftUIでちゃんとアプリとして動くところまで実装**してみました。## 前提
私はUIKitの経験は少なく、SwiftUIの経験が長いかつ濃いです。
また自分の好みとしてもUIKitよりSwiftUIです。このことからも推測できるとおり、**iOS開発に関してまだまだ
ARの魔法を手に入れるーーARオブジェクトを指で移動・拡大・回転する方法
#AppleのRealityComposerで作ったARオブジェクトに指のジェスチャーによるコントロールをつける方法です
#RealityComposerは簡単にARオブジェクトをつくれる。でも、どうやって指でコントロールすればいいの?
ARオブジェクトをどんどん配置できるRealityComposerは、グラフィック・ユーザー・インターフェースでARコンテンツを作れて便利です。これらのARを指で操作できたら、魔法みたいじゃないですか?
さて、どうすればそれが実現できるのでしょう?#これが答えだ
短いコードを書くと実現できま