2020-01-13

MVVM+DataBinding+RecyclerViewでカレンダーを作る - 1

2021年7月12日　追記

RecyclerView.AdapterのアイテムにDataBindingを用いるため、コンストラクタで LifecycleOwner (FragmentのviewLifecycleOwner) を渡すのは誤った実装でした。

発見に至った経緯

まったく別のアプリ開発でLifecycleRegistry.java内のObserverWithState.dispatchEventを確認していたところ、newState = event.getTargetStateにて、本来生きているはずの親FragmentのON_DESTROYが渡ってきていました。

static class ObserverWithState {
    State mState;
    LifecycleEventObserver mLifecycleObserver;

    ObserverWithState(LifecycleObserver observer, State initialState) {
        mLifecycleObserver = Lifecycling.lifecycleEventObserver(observer);
        mState = initialState;
    }

    void dispatchEvent(LifecycleOwner owner, Event event) {
        State newState = event.getTargetState();
        mState = min(mState, newState);
        mLifecycleObserver.onStateChanged(owner, event);
        mState = newState;
    }
}

ハッと、binding.lifecycleOwner = parentLifecycleOwner (実体はviewLifecycleOwner)を渡していたことを思い出しググってみたところ、上記の記事を発見したところです。

RecyclerView+DataBindingはどうすればいいんでしょうかね……。

以下、ご参考まで。

RecyclerViewでカレンダー風の表示を作ったので、備忘録的なまとめその１。 MVVM+DataBinding でViewに表示させるまでです。

発見に至った経緯
できるもの
使用した技術的なモノ
項目を sealed class で用意する
- sealed class Content の定義
データバインディングレイアウトファイルの作成
CalendarActivity の定義
CalendarActivityViewModel の定義
CalendarAdapter の定義
RecyclerView の拡張関数の定義
CalendarFragment の定義
- レイアウトファイルとバインド
- Fragment の定義
GitHub

2020-01-02

Firebase Hosting＋Functionsのメモ

Firebase

Firebase Hosting

プロジェクトを作成するフォルダに移動してinitコマンド

cd /project
firebase init

Hosting: Configure and deploy Firebase Hosting sitesを選択してポチポチ。するとプロジェクトフォルダに（デフォルトなら）publicというフォルダとindex.html等のファイルが生成される。 publicフォルダ内にHtml, CSS等を配置していく。

Hostingへのデプロイ

deployコマンドでデプロイする。

firebase deploy 

# Hostingのみの場合
firebase deploy --only hosting

最後に下記の形式でURLが発行されるので、ブラウザで開くと作成したページが見られるはず。

projectID.firebaseapp.com

再デプロイしてもうまく反映されないとき

再デプロイをしてもブラウザで見たときに反映されない場合があるが、キャッシュを削除することで直る場合がある。「chrome キャッシュクリア」あたりでググって見てください。（Chrome前提ですみません）

Cookieの削除等は不要、「キャッシュされた画像とファイル」の削除だけでおｋ。

Firebase Functions との連携

あるページにリクエストが来たとき、Functionsで動的にコンテンツを生成して返す方法。

基本全部こちらに載っている。

今回はprojectID.firebaseapp.com/hogeにアクセスされたとき、Functionsにて生成したHtmlを返すような例。 index.tsにて関数を定義（ここではdynamicChange）し、ステータスコードと返すHtmlを書く。

なお、今んところFunctionsによる動的コンテンツ生成はus-central1リージョンでしか対応していないそうなのでご注意を。

import * as functions from 'firebase-functions'

exports.dynamicChange = functions
  .region('us-central1')
  .https.onRequest((request, response) => {
    response.status(200).send(
      // 公式の例では返すHtmlをハードコーディングしている。。。
    )
  })

次にfirebase.jsonにて、rewritesを次のように書き換える。

{
  ...
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [ {
      // トリガーとなるページと関数
      "source": "/hoge",
      "function": "dynamicChange"
    } ]
  }
}