2019年アイマス活動振り返り

この記事は、アイドルマスター Advent Calendar 2019の23日目の記事です。
めちゃくちゃに大遅刻で気がついたら2020年になっちゃってたよ…。
もはやアドベントカレンダーではなく去年の振り返りとして書いているような状況です。
言い訳をするなら年末に引越しするのはやめよう!というところでしょうか(計画性皆無)
後、ネット開通してないのが痛すぎるね...。

さてこの記事では、2019年のアイマス活動についての振り返りを書いていきたいと思います。
2019年はVtuberのイベントに行くことが増えたのでアイマス関係はちょっと落ち着き気味ではありますが。

振り返り

1月

第33回アイドルLIVEロワイヤルを走りました。
もちろんのこと上位SRはフレデリカ。SR前のアンニュイな表情もフレちゃんも良いし特訓後のバッチリキメてるアイドルフレちゃんも最高。。
あと、この時の劇場でフレデリカがピアスを着用していることが明言されました。

始まったな。。。そーれかしこみかしこみ!

てかいまだにロワの走り方よくわかっとらんの笑うね。いつも代表さんのプロチャに助けられてます、圧倒的感謝...!

結果はなんと「82位」!
そこまで必死に走った記憶もないので意外と走りやすいイベントなのかもしれませんね。

f:id:hamup:20191207153430p:plain

(200位以内入り、この間のイベントが初めてかと思っていたら普通にこの時入賞してた…。)

2月

宮本フレデリカ誕生日オフ会に参加。
初対面の人と会うと緊張して疲れてしまうのでこれまで多人数のオフ会やイベントは敬遠しがちだったのだけど参加してみたらとても楽しかった!企画者さんに感謝。

用意されていたケーキが凝ってて凄い!ってなったやつ。
サイズがデカかったこともあり圧が強い。

f:id:hamup:20200102151939j:plain

3月

特になし…。

4月

特になし…。

5月

フレデリカP猫パンチオフ@ヒルトン東京マーブルラウンジ !!
パリ!ネコチャン!!イチゴ!!!がテーマのいちごビュッフェにフレデリカPで行った時のやつ。
リアルつながりだと絶対行かへんな...って感じだったので楽しかった〜。甘党なので無限にケーキとか食べてた気がする。 f:id:hamup:20200102154943j:plain f:id:hamup:20200102155019j:plain f:id:hamup:20200102155101j:plain

この後はシンデレラのBD鑑賞したり塚田で優勝したり...酒が美味かったね。

6月

特になし…。

7月

IM@S Engineer Talks 2019にスタッフとして参加しました。
アイマスが好きなエンジニアによるLT大会イベントです。
"アイマスエンジニア"という括りで集まっているので技術的には幅広いレイヤーのエンジニアが集まります。
そんな特性もあり、LTでは普段自分が使わないような技術でアイマスというコンテンツにコントリビュート(貢献)するお話が聞けたりと毎回刺激をもらってます。
なんだかんだ去年は1回もLTしなかったので2020年は最低1回を目標に頑張りたい所存。
LT大会の他、ハッカソンやアイディアソンなど毎年コンスタントに開催しているので興味のある方がいましたら↓をチェックしてみてください。

imas.connpass.com

これまでに開催されたイベントの配信は下記リンクから見ることができます。
www.youtube.com

8月

シャニマス サマパLV(夜の部)にソロ参加した。
idolmaster.jp

1stぶり2回目のシャニマスLVでした。
ライブが終わる頃には田中有希さんすこBotと化しストレイライトしか勝たんになっていた。
いや、あさひの実在性が高すぎた。汗ってあんなマンガチックに飛び散るもん何ですね。

全人類フォローした方がええ。 twitter.com

9月

歌姫庭園に行った!
おそらく冬コミぶりの同人イベ参加だったような気がする。
Anopianoさんの新作が買えたのでとても満足した〜....。

そしてなぜか寿司の写真しかスマホになかった f:id:hamup:20200102161248j:plain

10月

バンダイナムコフェス両日参加した〜。 fes.bn-ent.net

1日目は非オタクの先輩を連れて行った(クソ迷惑)んだけど理解のある先輩なので楽しかったよと言ってくれてクソ優しいな?となった。やっぱ10年の付き合いは伊達じゃないな(?)
全体通して満足度の高いライブだった、特に2日目!
ギルキス未履修やったけどパフォーマンスと歌唱力やばすぎて一瞬でブチ抜かれたね。 新曲の「New Romantic Sailors」まじでアチアチすぎたよな...。 www.youtube.com

これはめちゃくちゃ頭の悪い公式ペンラ(通称バカペンラ)。 f:id:hamup:20200102164142j:plain

こいつの使い道このライブ以外無いだろとか思ってたら引越し先の家でめっちゃ救われた。
シーリングライトが届くまでの5日間なんとかバカペンラで凌いだよね...まじでお前はすごいよ、バカペンラ。 f:id:hamup:20200102164625j:plain

11月

THE IDOLM@STER CINDERELLA GIRLS 7thLIVE TOUR Special 3chord♪ Funky Dancing!に両日参加しました。 idolmaster.jp

個人的には過去1位、2位を争うくらい非常に楽しめたライブでした。
DJ KOO来ると思うか普通...?まじで2日目の生DJタイムの時多動おじさんになってた...。
中盤くらいのひとしきり盛り上がったくらいの頃に来るでしょwと思ってたら普通に1発目ミラーボール・ラブきてビビったしブチ上がった...音源配信全裸待機しとるがまだですか?
てか衣装もまんじで可愛かったね〜〜〜THE・アイドル!って感じのフリフリ衣装もすこだけど、今回みたいな蛍光色ガンガン!って感じの衣装もすこだ〜...(語彙力)
なんとなくもこ田めめめちゃんの靴下的サムシングを感じましたね。

あと去年食べ損ねた名古屋めし的なものも食べれて良かった〜 f:id:hamup:20200102170148j:plain f:id:hamup:20200102170228j:plain f:id:hamup:20200102170255j:plain

まさかの復刻!?ということで童話公演 気まぐれアリスと不思議の国を走りました。
自分がモバマス復帰して初めて参加したイベントがこのイベントで、この時は全然戦力も整っておらず走り方も分かっていないど素人だったので全くいい成績を残せずに終わったという悔しい記憶の残るイベントだったので復刻決まった時は嬉しかったな〜。
昔と違って一緒に走る仲間たちがTwitterのTLやらプロダクションにいるので心強いしワイワイ走れて楽しいなって担当イベが来るたび思います。
仕事が忙しい時期に被ってしまったのでガリガリ走れたわけでは無いのですが、無事リベンジを果たし2枚取りすることができました。
f:id:hamup:20200102171036j:plain

フレアリスの特訓前、結構な大枚を叩いてフリトレでお迎えした記憶があるのですが流石に復刻イベ後は値崩れしてましたね、仕方なし。

12月

2019年最後の締めは、アイマスハッカソン2019 in関東! 今回は初の関東・関西同時開催ということで結構チャレンジングなイベントでした。 imas.connpass.com

自分はというと今回飲食周りの担当だったのでアイマスみあるお酒チョイスを頑張りました。
まあ単純に自分が飲みたかっただけというのはありますが...折角自分で選んだし〜と全部飲んだら結構酔ってしまったのはちょっとした失敗だったね...。

まとめ

ゆる〜く振り返って見ましたが、アイマス活動的には2017、2018年より結構大人しめな印象でした。
おそらくアイマスイベントとVtuberイベントとの参加比重が6:4くらいになったのが原因なんじゃ無いかなとは思ってますが...。

今年もライブと担当イベは死守しつつ、ゆる〜く活動を続けていければなと思います!
とりあえず今年もたくさん美味しいもの食べてたくさんお酒を飲むぞ。

冬休み1日1本映画鑑賞するぞ!というお話

近況

11月から別のPJに異動しました。(半年ぶり7回目)
s○nがクソ(単純に開発プロジェクトとか運用規約がマッチしてないだけではあるけど)すぎて闇落ちしそうになったり、1回のビルドに4時間とかふざけ倒すくらい長い時間かかるせいでどんなに急いでてもテストできずに発狂したり、その他諸々仕事が思ったように進まず虚無を繰り返したりとメンタル的に負担の大きい1ヶ月だった…。

ただ何とか今月終わるまでに設計からリリースまですべての工程を終えることができたのでひと安心。
メンバーが自分1人なのは結構寂しいけれど、上流から下流まで全部やれるのは楽しかったりする。あとはもう少し贅沢言うならもっと沢山コードに触れていたい。
しがないSIerなので叶わぬ夢だけれど、、、

仕事でお気持ち表明してしまったが、オタクと酒飲んでぶち上がったり、ナゴドライブ行って感情おしまいになったり、限界修羅飲みピクニック(?)したり、楽しかったことも多かったので結果オーライ!!オタクは心のオアシス🌴
来週からOSS周りのアップデート対応マラソンが始まるのでシワシワピカチュウみたいな顔になってるけど今年の残りもがんばるよ!!待ってろオタク忘年会!!!

本題

前置き長くなりましたがタイトルのお話についてです。

〜回想〜
ぼく「年末まで1ヶ月以上あるし帰省ワンチャンあるか〜?(ソラシドエアでチケット調べながら)」

ソラシドエア「片道40,800円でご用意するで😁」

ぼく「 往復8万!?うせやろ!つっかえ…(クソでかため息)」

ぼく「しゃあないけど休み中ヒマするのもヤやな…。」

ぼく「せや!信頼のオタクにオススメの映画教えてもらって冬休みに観たろ!」

〜回想おわり〜

無事年末年始の9連休の予定がnullになったのでそれを回避すべく思いついた企画(?)なわけです。
しかし宮崎マジで陸の孤島だな…。
まあ早めに予約すればもう少し安く帰れるんですけどね…でも新幹線で帰省できる地域から比べるとありえん高すぎる…うんち…😭

連休中は家に引きこもって「はじめてのOSコードリーディング」をがっつり読み込もうかな〜なんて思ってたんですけど、それだけじゃ味気ないし何かオモシレ〜ことねぇかな〜って仕事中考えてたらぱっと閃いたわけです。

Twitterで募集かけたところその日中に信頼のオタク達(皆さん)からおすすめ映画のリプライが届いてウレシイ....ウレシイ....となっていた。みんな優しいね、らゔ。
以下、教えて頂いた映画たち。

募集つい

映画リスト

  1. キツツキと雨
  2. バジュランギおじさんと、小さな迷子
  3. 最強のふたり
  4. マイ・インターン
  5. メッセージ
  6. グラン・トリノ
  7. ユージュアル・サスペクツ
  8. アメリカンスナイパー
  9. インターステラー
  10. ボーダーライン
  11. Mr.&Mrs.Smith
  12. ミセス・ダウト
  13. 英国王のスピーチ
  14. レ・ミゼラブル
  15. チョコレートドーナツ
  16. 三谷幸喜「short cut」
  17. 帝一の國 ☑️
  18. 海街diary
  19. アイデンティティ
  20. インビジブル・ゲスト
  21. ロストボディ
  22. キサラギ
  23. アフタースクール
  24. ルーブルース・ブラザーズ
  25. ハングオーバーシリーズ
  26. アンドリュー
  27. 宇宙人ポール
  28. 最高の人生の見つけ方
  29. シャークネード
  30. グランド・ブタペスト・ホテル
  31. ゴーン・ガール
  32. アイアンジャイアント
  33. SING
  34. スクールオブロック
  35. インセプション
  36. オーシャンズ8
  37. ミスト
  38. オール・ユー・ニード・イズ・キル ☑️
  39. セント・オブ・ウーマン
  40. マレフィセント ☑️
  41. 遊☆戯☆王 THE DARK SIDE OF DIMENSIONS

※☑️付きのものは既に観たことあるもの。それにしても観てなさすぎでは...??

これ観たかったやつだ!!!って作品がいくつもあってめちゃくちゃ困ってる、、、1日1本って言ったよね!!オタク、加減を知らんが。。。。(褒め言葉) とりあえず冬休み中に何を見るかは決めてないのでこれから考えたいと思います、多分結構気分で選んじゃう気がすると思うけど。

感想についてもブログにちょろちょろ書こうかな〜〜なんて思ったりもしたんですが、なにぶん文章に書き出すのにコストがかかるのと、そもそも感想を文章に纏めるのが得意な方ではないので恐らくしない確率の方が高いです。Twitterには多少呟くかもですが!

てな訳で冬休みに1日1本(以上)を目標にゆるゆる映画を楽しみたいと思います✌️

おわり。

Navigation(AAC)+BottomNavigationViewでItemとFragmentを簡単に紐づける

Navigationコンポーネントを利用することで、単純なボタンから始まり、アプリバー、ナビゲーションドロワーなどからの画面遷移を簡単に実装することができます。
今回は、Navigationコンポーネントを利用し、BottomNavigationViewのそれぞれのアイテムとFragmentを紐づけていい感じに表示しよう、というのが目的です。

AFragmentのボタンをクリックするとBFragmentへ遷移する~みたいなのは今回の実装に含みません。
実装する場合は、下記のリンクがとても参考になるので一読推奨。

Usage

1.ライブラリのダウンロード

Navigationコンポーネントを利用するために必要なライブラリをdependenciesに追記。
・build.gradle

    implementation "android.arch.navigation:navigation-fragment:1.0.0"
    implementation "android.arch.navigation:navigation-ui:1.0.0"
    implementation "android.arch.navigation:navigation-fragment-ktx:1.0.0"
    implementation "android.arch.navigation:navigation-ui-ktx:1.0.0"

2.BottomNavigationViewと紐づけるFragmentの作成

実際、後述するナビゲーショングラフの作成の時にFragmentの作成もまとめてできますが、如何せんテンプレートコードでFragmentが実装されるため不要なコードもくっついてきます。
ので、事前に自身が必要なFragmentクラスとレイアウト用のXMLを定義しておきましょう。

今回使うFragment

  • HomeFragment
  • ScheduleFragment
  • LikeFragment
  • OtherFragment

3.ナビゲーショングラフの作成

ナビゲーショングラフは、アプリの画面ごと遷移関係を定義するためのファイルとなります。
まずは、res配下にnavigationディレクトリを作成し、そこにXMLを作成します。(名前は任意)

・res/navigation/app_navigation.xml

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            xmlns:tools="http://schemas.android.com/tools"
            android:id="@+id/app_navigation.xml"
            app:startDestination="@id/homeFragment">

    <fragment android:id="@+id/homeFragment"
              android:name="com.example.hamp.HomeFragment"
              android:label="fragment_home"
              tools:layout="@layout/fragment_home"/>

    <fragment android:id="@+id/scheduleFragment"
              android:name="com.example.hamp.ScheduleFragment"
              android:label="fragment_schedule"
              tools:layout="@layout/fragment_schedule"/>

    <fragment android:id="@+id/likeFragment"
              android:name="com.example.hamp.LikeFragment"
              android:label="fragment_like"
              tools:layout="@layout/fragment_like"/>

    <fragment android:id="@+id/otherFragment"
              android:name="com.example.hamp.OtherFragment"
              android:label="fragment_other"
              tools:layout="@layout/fragment_other"/>
</navigation>

・Designタブで見たときの状態 f:id:hamup:20190609230451p:plain

4.BottomNavigationViewのmenu resource内のItemたちのId変更

BottomNavigationViewのアイテムとFragmentを紐づけるためには、ナビゲーショングラフのXMLで定義したFragmentのidと、menu resourceで定義しているアイテムのidを同一にしておく必要があります。
同一にしておくことでよしなに紐づけてくれます。

・res/menu/bottom_navigation_item.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
            android:id="@+id/homeFragment"
            android:icon="@drawable/baseline_home_white_24dp"
            android:title="Home"/>
    <item
            android:id="@+id/scheduleFragment"
            android:icon="@drawable/baseline_calendar_today_white_24dp"
            android:title="Schedule"/>

    <item
            android:id="@+id/likeFragment"
            android:icon="@drawable/baseline_favorite_white_24dp"
            android:title="Like"/>

    <item
            android:id="@+id/otherFragment"
            android:icon="@drawable/baseline_more_horiz_white_24dp"
            android:title="Other"/>

</menu>

4.NavHostFragmentをレイアウトファイルに定義する

レイアウトファイルにNavHostFragmentを追加します。
先程定義したナビゲーショングラフを実際にレイアウトとして利用するために、属性app:navGraphに設定します。

・res/layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<tools:FrameLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent" xmlns:tools="http://schemas.android.com/tools"
        >

    <fragment
            android:name="androidx.navigation.fragment.NavHostFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:navGraph="@navigation/app_navigation"
            app:defaultNavHost="true"
            android:id="@+id/navHostFragment"/>

    <android.support.design.widget.BottomNavigationView
            android:id="@+id/bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:background="@color/colorPrimary"
            app:itemIconTint="@drawable/bottom_navigation_colors"
            app:itemTextColor="@drawable/bottom_navigation_colors"
            app:menu="@menu/bottom_navigation_item" />

</tools:FrameLayout>

5.実行画面

4まで終われば完成です。実行してみると下記の様に選択するItemごとにFragmentが切り替わっているのが分かります。 f:id:hamup:20190609230454g:plain

参考サイト

BottomNavigationViewの実装について

BottomNavigationViewの実装についてメモ書き。
レイアウトファイルへの定義だけで実装が済んでしまうので思ったよりも簡単でした。
なお、公式ページのUsageに則りつつ最小限の実装しかしていませんのであしからず。

Usage

1.ライブラリのダウンロード

BottomNavigationViewを利用するために必要なライブラリをdependenciesに追記。

build.gradle

implementation 'com.android.support:appcompat-v7:28.0.0'
implementation 'com.android.support:design:28.0.0'

2.Viewに表示させるアイテム用のmenu resourceを作成する

まずは、表示させたいアイテムをmenu resourceに定義していきます。
尚、表示できるアイテムは最大で5つとなっています。

下記はアイテム4つ分のサンプルコード。
アイコンについては公式が出しているIcons - Material Designから素材を探すと◎。

・res/menu/bottom_navigation_item.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
            android:id="@+id/nav_home"
            android:icon="@drawable/baseline_home_white_24dp"
            android:title="Home"/>
    <item
            android:id="@+id/nav_schedule"
            android:icon="@drawable/baseline_calendar_today_white_24dp"
            android:title="Schedule"/>

    <item
            android:id="@+id/nav_favorite"
            android:icon="@drawable/baseline_favorite_white_24dp"
            android:title="Like"/>

    <item
            android:id="@+id/nav_other"
            android:icon="@drawable/baseline_more_horiz_white_24dp"
            android:title="Other"/>

</menu>

3.BottomNavigationViewの作成+menu resourceを紐づける

レイアウトのxml(下記例はMainActivity用)に、BottomNavigationViewのウィジェットを追加します。
各属性の内容は下記のようになっています。

属性 内容
android:background BottomNavigationViewの背景色を変更する。
app:itemIconTint itemのアイコンカラーを変更する。
app:itemTextColor itemのテキストカラーを変更する。
app:menu menu resourceを設定する。

・res/layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <!-- Main content -->

    <android.support.design.widget.BottomNavigationView
            android:id="@+id/bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:background="@color/colorPrimary"
            app:itemIconTint="@color/white"
            app:itemTextColor="@color/white"
            app:menu="@menu/bottom_navigation_item" />

</FrameLayout>

4.Selectorの設定

app:itemIconTintおよびapp:itemTextColorについて、単純に色を設定できるだけでなく、Selectorを書くことでアイテムの状態変化に応じて色を設定することができます。
これで、選択されているアイテムはホワイト、それ以外はグレーアウトにする、みたいなことができます。

・res/drawable/bottom_navigation_colors.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">

  <!-- 選択されているとき -->
  <item
      android:state_checked="true"
      android:color="@color/colorPrimary" />

  <!-- 選択されていないとき -->
  <item
      android:state_checked="false"
      android:color="@color/grey" />
 </selector>

・res/layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <!-- Main content -->

    <android.support.design.widget.BottomNavigationView
            android:id="@+id/bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:background="@color/colorPrimary"
            app:itemIconTint="@drawable/bottom_navigation_colors"
            app:itemTextColor="@drawable/bottom_navigation_colors"
            app:menu="@menu/bottom_navigation_item" />

</FrameLayout>

5.実行画面

実際に実行してみると下記の様な感じになります。 リソースファイルだけでここまで実装できるのは本当にすごいですね...!

f:id:hamup:20190609194632g:plain

まとめ

あとは、選択されたアイテムごとにそれぞれのレイアウトを紐づけることができればシュッとしたいい感じのアプリになりそうです。
なんとなく大変そうなイメージですが、AACNavigationコンポーネントを利用することレイアウトとの紐づけや画面遷移の設定について簡単に実装することができます。

実際の方法についてを下記に追記しました。
hamup.hatenablog.com

参考サイト

Youtube APIを利用してアイドル部のデータを取得する_Part1

Youtubeが公開しているAPI
YouTube Data API の概要  |  YouTube Data API (v3)  |  Google Developers

これを使ってアイドル部メンバーのチャンネル情報を取得、AndroidのRecyclerViewを使って表示しよう!というのが趣旨。
今回はYoutube APIを利用するまでの手順を解説したいと思います。

APIを利用するための準備

YoutubeAPIは、APIキーの情報も乗せてリクエスト送信する必要があります。 そのため、事前にAPIキーの取得をしきましょう。

  • Google Cloud Platformを開く。
  • プロジェクトを選択する。(ない場合は新規に作成する)
  • 左のサイドバーから[ライブラリ]を選択する。
  • 検索バーに[Youtube]を入れると選択肢に[YouTube Data API v3]が表示されるので選択する。
  • [有効にする]を選択する。
  • 選択後、遷移した画面の[認証情報を作成]を選択する。
  • 下記のようにユースケースに合わせて選択し、[必要な認証情報]を選択する。 f:id:hamup:20190519172457p:plain

  • 最後にAPIキーが発行されるので確認して完了。 f:id:hamup:20190519172954p:plain

承認の認証情報を取得する  |  YouTube Data API (v3)  |  Google Developers

実際に使ってみる

APIキーを発行したので、実際叩けるようになったのか確認。
例として、たまちゃん(夜桜たま)のチャンネル情報を取得してます。

チャンネルの情報を取得するためには、チャンネル固有のIDを指定する必要があるのでそちらを先に調べておきます。
チャンネルIDは、チャンネルのTOPページのURLのchannel以降の文字列となります。
f:id:hamup:20190519172515p:plain

あとはSerach(検索)用のAPIにたまちゃんのチャンネルIDを指定するだけ。
これでチャンネルの動画情報を取得することができます。
Search: list  |  YouTube Data API (v3)  |  Google Developers

リクエス

下記のHTTPリクエストを発行。

https://www.googleapis.com/youtube/v3/search?part=snippet&channelId=UCOefINa2_BmpuX4BbHjdk9A&key=APIキー

ただ、これだけのパラメータ指定だと、実際データを扱う際に色々不便なところが多いです。
例えばデフォルトだと5件の動画情報しか取れない、日付順に並んでいない、最大50件までしか取得できない...etc
公式のリファレンスを見るとわかりますが、パラメータ指定してあげれば上の問題は解決します。(余力があったら実際のリクエストも追記します。)

取得データ

いい感じに取得できていますね。
あとはAndroid側でAPI叩けるようにして画面に表示するだけです。

{
    "kind": "youtube#searchListResponse",
    "etag": "\"XpPGQXPnxQJhLgs6enD_n8JR4Qk/bW-2tqqtTLESSvKwL9a7Ny7ASYg\"",
    "nextPageToken": "CAUQAA",
    "regionCode": "JP",
    "pageInfo": {
        "totalResults": 180,
        "resultsPerPage": 5
    },
    "items": [
        {
            "kind": "youtube#searchResult",
            "etag": "\"XpPGQXPnxQJhLgs6enD_n8JR4Qk/Q5mCuMbj3r1Z-e6gxhSOKYMGE4E\"",
            "id": {
                "kind": "youtube#video",
                "videoId": "Gn-wIcBio6E"
            },
            "snippet": {
                "publishedAt": "2019-03-03T13:57:49.000Z",
                "channelId": "UCOefINa2_BmpuX4BbHjdk9A",
                "title": "【音MAD】タマガツモル feat.ばあちゃる【アイドル部】",
                "description": "お誕生日、たくさんお祝いしてくださってありがとうございました…! これからも楽しいことをいっぱい共有していけるように頑張ります(*´°`*)...",
                "thumbnails": {
                    "default": {
                        "url": "https://i.ytimg.com/vi/Gn-wIcBio6E/default.jpg",
                        "width": 120,
                        "height": 90
                    },
                    "medium": {
                        "url": "https://i.ytimg.com/vi/Gn-wIcBio6E/mqdefault.jpg",
                        "width": 320,
                        "height": 180
                    },
                    "high": {
                        "url": "https://i.ytimg.com/vi/Gn-wIcBio6E/hqdefault.jpg",
                        "width": 480,
                        "height": 360
                    }
                },
                "channelTitle": "夜桜たま",
                "liveBroadcastContent": "none"
            }
        },
        {
            "kind": "youtube#searchResult",
            "etag": "\"XpPGQXPnxQJhLgs6enD_n8JR4Qk/vC6W6LRgL53y_4p15XXD7d_9yL8\"",
            "id": {
                "kind": "youtube#video",
                "videoId": "K3c0DjYEo48"
            },
            "snippet": {
                "publishedAt": "2018-10-04T13:30:00.000Z",
                "channelId": "UCOefINa2_BmpuX4BbHjdk9A",
                "title": "【怒ってる?】ツンデレの黄金比は9:1【さくたま流】",
                "description": "「ツンデレ」と言われる女流プロはたくさんいらっしゃいますが、普段はふわふわ卓上ではきりり。 そのギャップにこっちはめろめろ(∩ˊ꒳​ˋ...",
                "thumbnails": {
                    "default": {
                        "url": "https://i.ytimg.com/vi/K3c0DjYEo48/default.jpg",
                        "width": 120,
                        "height": 90
                    },
                    "medium": {
                        "url": "https://i.ytimg.com/vi/K3c0DjYEo48/mqdefault.jpg",
                        "width": 320,
                        "height": 180
                    },
                    "high": {
                        "url": "https://i.ytimg.com/vi/K3c0DjYEo48/hqdefault.jpg",
                        "width": 480,
                        "height": 360
                    }
                },
                "channelTitle": "夜桜たま",
                "liveBroadcastContent": "none"
            }
        },
        {
            "kind": "youtube#searchResult",
            "etag": "\"XpPGQXPnxQJhLgs6enD_n8JR4Qk/2s-dBLSzy51UCdWXhwsUgy0irQs\"",
            "id": {
                "kind": "youtube#video",
                "videoId": "WjhFJZ726eE"
            },
            "snippet": {
                "publishedAt": "2018-09-14T13:00:09.000Z",
                "channelId": "UCOefINa2_BmpuX4BbHjdk9A",
                "title": "【自己紹介】はじめまして!夜桜たまです!",
                "description": "3度の飯より麻雀が好き! 立派な電脳雀士になりたいVTuberです(∩ˊ꒳​ˋ∩)・* ✿Twitter https://twitter.com/YozakuraTama ✿公式サイト https://vrlive.party/...",
                "thumbnails": {
                    "default": {
                        "url": "https://i.ytimg.com/vi/WjhFJZ726eE/default.jpg",
                        "width": 120,
                        "height": 90
                    },
                    "medium": {
                        "url": "https://i.ytimg.com/vi/WjhFJZ726eE/mqdefault.jpg",
                        "width": 320,
                        "height": 180
                    },
                    "high": {
                        "url": "https://i.ytimg.com/vi/WjhFJZ726eE/hqdefault.jpg",
                        "width": 480,
                        "height": 360
                    }
                },
                "channelTitle": "夜桜たま",
                "liveBroadcastContent": "none"
            }
        },
        {
            "kind": "youtube#searchResult",
            "etag": "\"XpPGQXPnxQJhLgs6enD_n8JR4Qk/Hx25AZuuVuhx47dRMwGMFKs1IhM\"",
            "id": {
                "kind": "youtube#video",
                "videoId": "EYdnZW0Xlho"
            },
            "snippet": {
                "publishedAt": "2018-07-20T15:15:01.000Z",
                "channelId": "UCOefINa2_BmpuX4BbHjdk9A",
                "title": "【PUBG】戦闘訓練する【アイドル部】",
                "description": "皆さん、こんばんは! 私立ばあちゃる学園のアイドル部、そして麻雀部の部長を兼任しております。 夜桜たまです。 今日は立派なアイドルにな...",
                "thumbnails": {
                    "default": {
                        "url": "https://i.ytimg.com/vi/EYdnZW0Xlho/default.jpg",
                        "width": 120,
                        "height": 90
                    },
                    "medium": {
                        "url": "https://i.ytimg.com/vi/EYdnZW0Xlho/mqdefault.jpg",
                        "width": 320,
                        "height": 180
                    },
                    "high": {
                        "url": "https://i.ytimg.com/vi/EYdnZW0Xlho/hqdefault.jpg",
                        "width": 480,
                        "height": 360
                    }
                },
                "channelTitle": "夜桜たま",
                "liveBroadcastContent": "none"
            }
        },
        {
            "kind": "youtube#searchResult",
            "etag": "\"XpPGQXPnxQJhLgs6enD_n8JR4Qk/WszUy5cPkZWZ_qWKqM-U2wBipKE\"",
            "id": {
                "kind": "youtube#video",
                "videoId": "c_P3_Zs6Ib4"
            },
            "snippet": {
                "publishedAt": "2018-09-07T12:33:25.000Z",
                "channelId": "UCOefINa2_BmpuX4BbHjdk9A",
                "title": "Prologue_夜桜たま",
                "description": "夜桜たまTwitter:https://twitter.com/YozakuraTama .LIVE公式サイト:https://vrlive.party/member/",
                "thumbnails": {
                    "default": {
                        "url": "https://i.ytimg.com/vi/c_P3_Zs6Ib4/default.jpg",
                        "width": 120,
                        "height": 90
                    },
                    "medium": {
                        "url": "https://i.ytimg.com/vi/c_P3_Zs6Ib4/mqdefault.jpg",
                        "width": 320,
                        "height": 180
                    },
                    "high": {
                        "url": "https://i.ytimg.com/vi/c_P3_Zs6Ib4/hqdefault.jpg",
                        "width": 480,
                        "height": 360
                    }
                },
                "channelTitle": "夜桜たま",
                "liveBroadcastContent": "none"
            }
        }
    ]
}

まとめ

今回はAPIでのチャンネル情報取得について書きました。
次の記事では実際にAndroidでのAPIの叩き方、画面表示の仕方、の2つについて解説したいと思います。

話変わりますが、今日は「アイドル部1周年ライブ はんぱないパッション」の当日です。みんなさん!ライブ楽しもうね!!

RecyclerViewで登場するキーワードについてのまとめ

あるデータセットをリスト形式で表示する場合、RecyclerViewウィジェットを使用して実装していく。 実装する上でいくつかのキーワードが登場するが、それぞれがどんな役割を果たしているのか頭の中でもやっとしている状態だったので、整理するためにも今回の記事に纏めたいと思う。

解説

Adapter

AndroidでいうAdapterはViewとデータセットを紐づける役割を持つ。 RecyclerView.Adapterを利用することで、表示するレイアウト(View)とデータセットを紐づける事ができる。 下記、公式引用。
Adapters provide a binding from an app-specific data set to views that are displayed within a RecyclerView.

LayoutInflater

LayoutInflaterを利用することで、XMLファイルに対応するViewオブジェクトをインスタンス化することができる。 よく、インフレートするという文章を見るが、前述したようにViewオブジェクトのインスタンス化という理解でいいのかなーと思う。

一例であるが下記の様にしてViewオブジェクトの生成を行うことができる。

val layoutInflater = LayoutInflater.from(context)
val view = layoutInflater.inflate(R.layout.sample_row, parent, false)

尚、Inflateには、一般的な意味として、膨らませるというような意味がある。

ViewHolder

RecyclerViewでのViewHolderの役割を一言で表すと「1行分のViewに対する参照を保持するもの」と言える。
Adapterは、画面に表示する行数分のViewHolderを作成し、行ごとに応じたデータをViewHolderに設定し、その情報をRecyclerViewに格納する。

RecyclerView.ViewHolder ⇒ 親Viewの参照を保持
RecyclerView.ViewHolderを継承した自作ViewHolder ⇒ 子Viewの参照を保持

RecyclerView.Adapterの基本的な実装

前述までの話を踏まえたうえで、RecyclerView.Adapterの実装のサンプルコードを下記に示す。

  • アダプター(SampleListAdapter.kt)
class SampleListAdapter(private val myDataset: MutableList<MyData>):
    RecyclerView.Adapter<SampleListAdapter.MyViewHolder>() {

    /* 基底クラスの初期化には親Viewへの参照を渡す */
    class MyViewHolder(view: View): RecyclerView.ViewHolder(view) {
    /* 子Viewへの参照を保持する */
        val imageView = view.findViewById(R.id.sample_imageView) as ImageView
        val textView = view.findViewById(R.id.sample_title_textView) as TextView
    }

    /* XMLレイアウトに応じたViewオブジェクトの作成とViewHolderの作成 */
    override fun onCreateViewHolder(parent: ViewGroup, position: Int): MyViewHolder {
        val layoutInflater = LayoutInflater.from(parent.context)
        val view = layoutInflater.inflate(R.layout.sample_item_row, parent, false)

        return MyViewHolder(view)
    }

    /* 作成したViewHolder内のViewに対して更新を行う */
    override fun onBindViewHolder(holder: MyViewHolder, position: Int) {
        Picasso.get().load(url).into(holder.imageView)
        holder.textView.text = myDataset[position].text
    }

    override fun getItemCount(): Int = myDataset.size
}

フラグメント(SampleListFragment.kt)

class SampleListFragment: Fragment() {

    private lateinit var recyclerView: RecyclerView
    val dummyDataset: MutableList<MyData> = mutableListOf()

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        val view = inflater.inflate(R.layout.sample_list_fragment, container, false)

        recyclerView = view.findViewById(R.id.recyclerview)
        val layoutManager = LinearLayoutManager(context, LinearLayoutManager.VERTICAL, false)
        recyclerView.layoutManager = layoutManager

        dummyData()
        val adapter = SampleListAdapter(dummyDataset)
        /* 作成したAdapterをRecyclerView.Adapterに接続 */
        recyclerView.adapter = adapter

        return view
    }
    
    fun dummyData() {
        val dummyData1 = ChannelList("https://i.ytimg.com/vi/cw256acegBA/hqdefault.jpg", "dummyText1")
        val dummyData2 = ChannelList("https://i.ytimg.com/vi/cw256acegBA/hqdefault.jpg", "dummyText2")
        val dummyData3 = ChannelList("https://i.ytimg.com/vi/cw256acegBA/hqdefault.jpg", "dummyText3")
        dummyDataset.add(dummyData1)
        dummyDataset.add(dummyData2)
        dummyDataset.add(dummyData3)

    }
}

まとめ

ざっと書いただけなので余り綺麗にまとまっていないが頭の中がだいぶ整理できた気がする。
RecyclerViewってListViewに比べると自分でいろいろ実装しないといけないところが増えているので、上記で書いたこと以外にも押さえておくべきところが沢山ある。
そこについては実装する機会があるときにまた纏めたいと思う。

参考サイト

画像ライブラリ Picassoの基本的な使い方

Picassoとは

square社が作成した、Android向けの画像ダウンロード・キャッシュライブラリ。
当ライブラリを利用することで、インターネットからの画像ダウンロードなどが簡単に実装できる。
例えば、APIを叩いて返却されたJSONが持っている画像URLの情報を渡すだけで、
画像ダウンロードからImageViewへのデータセットまで行ってくれる。

ライブラリのダウンロード

gradleのdependenciesに下記を追記する。

dependencies {
  /* 現在の最新 */
  implementation 'com.squareup.picasso:picasso:2.71828'
}

Usage

最も単純な使い方。URL先の画像をimageViewにセットできる。

Picasso.get().load("http://i.imgur.com/DvpvklR.png").into(imageView);

画像のリサイズなども行える。

Picasso.get()
  .load(url)
  .resize(50, 50)
  .centerCrop()
  .into(imageView)

Tips

  • 取得先のURLがhttpの場合、取得に失敗する。
    対処法:httpをhttpsに変換する。
    下記はreplaceメソッドでhttpをhttpsに置き換えている。
Picasso.get().load(photos[position].image_url.replace("http", "https"))
    .into(viewHolder.photoImageView)

 

参考サイト