iOSで妄想トーク(チャットUI)を再現してみた

社内で開かれたLTイベントの発表資料

Transcript

1. iOSͰໝ૝τʔΫΛͭ͘Δ aboy
2. aboyͰ͢ ‣ ͋΅Ͱ͢ ‣ ৽ଔೖࣾ3೥໨Ͱ͢ ‣ ·ͩITΠϊϕʔγϣϯ3෦Ͱ͢ ‣ 4݄͝Ζ͔ΒiOS։ൃʹܞΘͬͯ·͢
3. ໝ૝τʔΫΛͭ͘Γ͍ͨ
4. ໝ૝τʔΫͱ͸ʁ ‣ instagramに #妄想トーク で投稿された(主に)乃木坂46 とチャットしているかのように見えるスクショ ‣ instagramに投稿されているものに限らず架空の誰かと チャットしている雰囲気をつくれるサービスがある ‣ Androidアプリ チャットノベル ‣ iOSアプリ Imaginary Chat ‣ Webサービス モジマル
5. ͜͏͍͏ͷ
6. iOSͰໝ૝τʔΫ(νϟοτUI)Λ ࠶ݱͯ͠Έͨ
7. όφφϚϯ
8. ࣮૷ͷϙΠϯτ
9. iOSʹ͓͚Δςʔϒϧߏ଄ UITableView UITableViewCell
10. UITableViewͷ࢓૊Έ var objects = [ Object(title: "タイトル0"), Object(title: "タイトル1"), Object(title: "タイトル2"), .... ]
11. UITableViewͷ࢓૊Έ -tableViewΛ180౓ճస- var objects = [ Object(title: "タイトル0"), Object(title: "タイトル1"), Object(title: "タイトル2"), .... ] tableView.transform = CGAffineTransform(rotationAngle: CGFloat(Double.pi)) ϥδΞϯͰࢦఆ
12. UITableViewͷ࢓૊Έ -cell΋180౓ճసͤ͞Δͱ- var objects = [ Object(title: "タイトル0"), Object(title: "タイトル1"), Object(title: "タイトル2"), .... ] tableView.transform = CGAffineTransform(rotationAngle: CGFloat(Double.pi)) cell.transform = CGAffineTransform(rotationAngle: CGFloat(Double.pi))
13. UITableViewͷ࢓૊Έ -σʔλͷ௥Ճ- var objects = [ Object(title: "タイトル0"), Object(title: "タイトル1"), Object(title: "タイトル2"), .... ] tableView.transform = CGAffineTransform(rotationAngle: CGFloat(Double.pi)) cell.transform = CGAffineTransform(rotationAngle: CGFloat(Double.pi)) // 新しいもの insert(Object(title: "new"), at: 0) // 古いもの insert(Object(title: "old"), at: objects.count)
14. ͋ͱ͸... var objects = [ Object(title: "タイトル0"), Object(title: "タイトル1"), Object(title: "タイトル2"), .... ] tableView.transform = CGAffineTransform(rotationAngle: CGFloat(Double.pi)) cell.transform = CGAffineTransform(rotationAngle: CGFloat(Double.pi)) // 新しいもの insert(Object(title: "new"), at: 0) // 古いもの insert(Object(title: "old"), at: objects.count) ・受信か送信かで左or右表示の切り替え ・受信なら相手のプロフィール画像を表示 ・テキストを入力して送信できるように ・送受信日付を表示 ・etc...
15. ͋ͱ͸... var objects = [ Object(title: "タイトル0"), Object(title: "タイトル1"), Object(title: "タイトル2"), .... ] tableView.transform = CGAffineTransform(rotationAngle: CGFloat(Double.pi)) cell.transform = CGAffineTransform(rotationAngle: CGFloat(Double.pi)) // 新しいもの insert(Object(title: "new"), at: 0) // 古いもの insert(Object(title: "old"), at: objects.count) ・受信か送信かで左or右表示の切り替え ・受信なら相手のプロフィール画像を表示 ・テキストを入力して送信できるように ・送受信日付を表示 ・etc... ׬੒
16. ໝ૝τʔΫྫ
17. όφφϚϯ
18. ෢Ҫ૖
19. ੢໺ࣣ੉ʢ೫໦ࡔ46ʣ
20. ·ͱΊ ‣ ֎෦ϥΠϒϥϦͳ͠Ͱ௒؆୯ʹLINEΈ͍ͨͳ
 νϟοτUI͕ͭ͘ΕΔ ‣ ࢖ͬͯΔͷ͸UIKit(ඪ४)͚ͩ ‣ ໝ૝τʔΫΛͭͬͯ͘༡΂Δ ‣ Έͳ͞Μ΋iOS։ൃֶΜͰΈ·ͤΜ͔ʁ
21. ࢀߟ 1. Apple Developer Documentation: CGAffineTransform.init(rotationAngle:) https://developer.apple.com/documentation/coregraphics/cgaffinetransform/ 1455666-init 2. 武井壮 最強動物1位の室伏広治 - YouTube https://www.youtube.com/watch? v=7fIFsBUX0tw 3. 西野七瀬のメイクを真似したい！！ https://matome.naver.jp/odai/ 2150238529392593401