Parcelabeと実行時エラー

なかなか直せなかったバグが、Parcelable関連を見直すことで直ったので、その時に気づいた注意点を残しておく.

Parcelableを実装するときの注意

例えば、Stringの配列をreadする際は、readStringArrayではなく、createStringArrayを使う :

public class MyData implements Parcelable {
    
    private String mStringArray[];
    
    public String[] getStringArray() {
        return mStringArray;
    }
    
    public void setStringArray(String stringArray[]) {
        this.mStringArray = stringArray;
    }
    
    private MyData(Parcel in) {
        mStringArray = in.createStringArray();
    }

    @Override
    public void writeToParcel(Parcel dest, int flags) {
        dest.writeStringArray(mStringArray);
    }

    @Override
    public int describeContents() {
        return 0;
    }

    public static final Creator<MyData> CREATOR = new Creator<MyData>() {
        @Override
        public MyData createFromParcel(Parcel in) {
            return new MyData(in);
        }

        @Override
        public MyData[] newArray(int size) {
            return new MyData[size];
        }
    };
}

もし、readStringArray使った場合、画面回転程度の読み込みではエラーは出ないが、「アクティビティ破棄する(アクティビティを保持しない)」設定をオンにした状態で再起動する(ホームボタン→アプリ起動)と、私の環境では次のエラーが出た.

Caused by: java.lang.NullPointerException: Attempt to get length of null array
...
at MainActivity.onCreate(MainActivity.java:xxx)

Parcelableでデータを受渡しするときの注意

特に、onRestoreInstanceState、onSavedInstanceStateでアクティビティの復元を行う際、putParcelableArrayやgetParcelableArrayなどで、Parcelableの配列を使わないほうが良い.

...
private MyData myData[];
...
@Override
protected void onRestoreInstanceState(Bundle savedInstanceState) {
    ...
    myData = (MyData[])savedInstanceState.getParcelableArray(Key1);
    ...
}

上のようにキャストしないとコンパイルエラーが発生するが、アクティビティが破棄された後(「アクティビティを破棄する」設定をオンにしてアプリケーションを終了する)では、Bundle内で型の情報が保持されないようで、次のようなエラーが出た.

Caused by: java.lang.ClassCastException: android.os.Parcelable[] cannot be cast to com.foo.example.MyData[]
        at com.foo.example.MainActivity.onViewStateRestored(MainActivity.java:xxx)

代わりに、putParcelableArrayListやgetParcelableArrayListを使うことで、このエラーを回避できた.

...
private ArrayList<MyData> myData;
...
@Override
protected void onRestoreInstanceState(Bundle savedInstanceState) {
    ...
    myData = savedInstanceState.getParcelableArrayList(Key1);
    ...
}

参考にしたサイト

Android ParcelでString[]を読んだり書いたり

RecyclerView in NestedScrollViewでスクロールが角つく

javaコード中で、次を追加すると回避できた.

recyclerView.setNestedScrollingEnabled(false);

しかし、そもそもNestedScrollViewとRecyclerViewをネストにすることが問題っぽい.
例えば、画面をスクロールしてもRecyclerView.onScrolledは呼ばれないみたいなので、ネストするというデザインを変えたほうがいいかもしれない.

参考にしたサイト

ANDROID – RECYCLERVIEW INSIDE NESTEDSCROLLVIEW EXAMPLE

CheckBoxのチェックボックスを右側に表示させる。

題名の日本語が少し怪しい感じがするが、CheckBoxはデフォルトでは次のようになる.

これを次のようにするのが当記事の目的である.

API 17以上の場合

xmlの方で、CheckBoxのlayoutDirction属性をrtlにしてやるだけ.

android:layoutDirection="rtl"

API 17未満の場合

同じくxmlの方で、CheckBoxに、次の2つを加える.

android:button="@null"
android:drawableEnd="?android:attr/listChoiceIndicatorMultiple"

ただ、この方法だとCheckBoxをクリックしたとき、チェックボックスではなくCheckBoxの中心がハイライトされるので注意(下の画像を参照).

参考にしたサイト

How to show android checkbox at right side?

BloggerにSyntaxHighlighterを導入する!

SyntaxHighlighter v3は導入できなかったが、最新のSyntaxHighlighter v4を導入できたので、その方法を紹介したいと思う.
SyntaxHighlighterを導入できずに諦めている人にぜひ読んでもらい、私と同じ喜びを感じてほしいと思う.

導入する！

その0

Git Bash(Windowsの場合)とNode.js(LTSのほうが良い?)をインストールする.

その1

Git Bushを起動して、syntaxhighlighterを保存するローカルディレクトリに移動し、以下のコードを続けて入力する.

$ git clone https://github.com/syntaxhighlighter/syntaxhighlighter.git
$ cd syntaxhighlighter
$ npm install

次のような感じ

その2

続いて、以下のコードを入力する.

ko-ika@PC MINGW64 ~/Blogger/syntaxhighlighter (master)
$ ./node_modules/gulp/bin/gulp.js setup-project

そのまま通れば(その3へ)問題ないが、次のエラーが出るかもしれない.(私の場合はこうなった.)

[hh:mm:ss] TypeError: loadReposFromCache(...).error is not a function

この時は、 /syntaxhighlighter/build/setup-project.js を開いて、39行の error を catch に変える.
つまり、39行目を次のようにして上書き保存する.

const loadRepos = () => loadReposFromCache().catch(loadReposFromGitHub).then(R.map(R.pick(['clone_url', 'name'])));

そして、Git Bashで、その2の初めのコードを再び入力する(うまくいくはず).

無事成功すると、 /syntaxhighlighter/repos/ 下に新たなファイルフォルダーがダウンロードされる.

その3

次に、 ./node_modules/gulp/bin/gulp.js build を使う.

この時に、 --brushes と --theme を指定する.

--brushes

Xという言語をハイライトさせたいのなら、 --brushes=X という風にする.

コンマで区切ることで複数指定することもできる: --brushes=X,Y

どの言語が対応しているかは、 /syntaxhighlighter/repos/ 下にある brush-X という名前のフォルダーを探せばわかる(Xには、具体的な言語が入る、javascriptとか).

また、 --brushes=all とすれば、 /syntaxhighlighter/repos/ 下にある言語すべてをハイライトできる.

--theme

Xというテーマを使いたかったら、 --theme=X という風に指定する。

使用できるテーマは、以下のサイトに載ってる(多分).

SyntaxHighlighter 3.0.83 Themes

次のサイトは、画像もあって役に立つ.

テーマ毎のソースコード表示例

/syntaxhighlighter/repos/ 下にあるフォルダー theme-X を探してもらえば、対応しているテーマが分かる.

使用例

例えば、javascriptとcssをハイライトさせたくて、テーマはdefaultにしたい場合、Git Bashに次のように入力する.

ko-ika@PC MINGW64 ~/Blogger/syntaxhighlighter (master)
$ ./node_modules/gulp/bin/gulp.js build --brushes=javascript,css --theme=default

これが通れば問題ないので、その6まで行ってほしいが、次のエラーが出るかもしれない. 多分出る.

[hh:mm:ss] TypeError: Promise.props is not a function

その4

/syntaxhighlighter/build/bundle.js を開いて、33行目の 'songbird' を 'bluebird' に変えて、上書き保存する.

  const Promise = require('bluebird');

そして、再び ./node_modules/gulp/bin/gulp.js build --brushes=javascript,css --theme=defaultを走らせる.

上の画像のように、次のようなエラーが発生すると思う(もし、うまくいったらその6まで飛んでもらいたい).

ERROR in ./src/core.js
Module not found: Error: Cannot resolve module 'brush-javascript' in C:\Users\ko-ika\Blogger\syntaxhighlighter\src
 @ ./src/core.js 241:14-41

その5

上のエラー中の、Module not found: Error: Cannot resolve module 後の2つの'で囲まれたファイルフォルダーを手動でインストールする.

ko-ika@PC MINGW64 ~/Blogger/syntaxhighlighter (master)
$ npm install folder-name

上の例では、以下のようにする.

ko-ika@PC MINGW64 ~/Blogger/syntaxhighlighter (master)
$ npm install brush-javascript

ko-ika@PC MINGW64 ~/Blogger/syntaxhighlighter (master)
$ npm install brush-css

そして、 ./node_modules/gulp/bin/gulp.js buildを走らせる.

特にエラーは出ないで、終了すると思う.

もし、うまくいかなかったら、次も試してみる.

npm install opts-parser
npm install syntaxhighlighter-match
npm install syntaxhighlighter-html-renderer
npm install syntaxhighlighter-regex

その6

syntaxhighlighter/dist ディレクトリ下にいくつかのファイルが生成されているが、その中の、 syntaxhighlighter.js と theme.css を各自のサーバーにアップロードする。

あとは、ブログのHTMLをいじるだけ(ここから先は、こちらの記事のその2と似ている).

Boggerのトップページのサイドメニューの「レイアウト」をクリックし、「HTML編集」ボタンを押す.

</head>タグの上に以下のコードを挿入する.

<script src='[path]/syntaxhighlighter.js' type='text/javascript'/>
<link href='[path]/theme.css' rel='stylesheet' type='text/css'/>

コード中の[path]は、syntaxhighlighter.jsと、theme.cssをアップロードしたフォルダー名を指定する. 同じフォルダーでなくてもよい. 例えば、https://foo.com/styles/theme.css、https://foo.com/scripts/syntaxhighlighter.jsなど.

そして、「テーマを保存」ボタンを押すだけ.

使用方法・注意点

使い方は、基本的に前のバージョンのSyntaxHighlighterとかわらないっぽいので、他のサイトを見てもらいたい.

一つだけ注意することは、この方法で導入したハイライターにはデフォルトでツールバーが表示されないことだ.

参考にしたサイト

SyntaxHighlighter v4

Building

Building: loadReposFromCache(...).error is not a function #428

gulp build fails - Cannot resolve module #407

ColorFilterを元に戻す

方法は2つ見つかった.

その1

EditText editText = findViewById(R.id.editText);

editText.getBackground().clearColorFilter();

その2

EditText editText = findViewById(R.id.editText);

editText.getBackground().setColorFilter(null);

うまくいかなかったら、この後に次を入れる.

editText.refreshDrawableState();

参考にしたウェブサイト

EditTextの下線の色をColorFilterで切り替えるときに注意すること

イメージをグレースケールにしたりカラーに戻したり

ConstraintLayoutの制約をJavaで設定する

ConstraintLayout#LayoutParamsを使う. まず、ConstraintLayout上のViewを取得する.

Button button = findViewById(R.id.button);

もしくは、追加したい適当なオブジェクトを作成し、ConstraintLayoutにViewを追加する.

Button button = new Button(this);
constrintLayout.addView(button)

※先にaddViewしないと、次のlayoutParamsにnullが入る(エラーが発生する)ので注意.

次に、上のViewのLayoutParamsを取得し、適当に設定する. 親View(?)と連結したいときは、PARENT_IDを代入する. ほかのViewと連結したいときは、View#getIdメソッドを使う. LayoutParamsのフィールドについては、xmlのものとほとんど同じなので、そちら(例えば、Android Studioのデザインビューとか)を見るとわかりやすいと思う.

ConstraintLayout.LayoutParams layoutParams = (ConstraintLayout.LayoutParams)button.getLayoutParams();
layoutParams.startToEnd = anotherView.getId();
layoutParams.endToEnd = ConstraintLayout.LayoutParams.PARENT_ID;
layoutParams.topToTop = ConstraintLayout.LayoutParams.PARENT_ID;
layoutParams.bottomToBottom = ConstraintLayout.LayoutParams.PARENT_ID;
layoutParams.verticalBias = (float) 0.1;
layoutParams.horizontalBias = (float) 0.1;
button1.setLayoutParams(layoutParams);

最後に、上の変更を適用する.

button.setLayoutParams(layoutParams);

他にもこちらと同様に、ViewのWidthやHeight、Marginを変更できたりする(MarginLinearLayoutにキャストしなくてもよい、次の適用例を参照).

適用例

ConstraintLayout上に2つのボタンを表示させる.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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/constraintLayoutParamsLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.blogspot.ko-ika.constraintlayoutparams.MainActivity">

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button1" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button2" />
</android.support.constraint.ConstraintLayout>

activity_main.xml

package jp.blogspot.ko-ika.constraintlayoutparams;

import android.support.constraint.ConstraintLayout;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button1 = findViewById(R.id.button1);
        Button button2 = findViewById(R.id.button2);

        ConstraintLayout constraintLayout = findViewById(R.id.constraintLayoutParamsLayout);

        // Button1の設定
        ConstraintLayout.LayoutParams layoutParams = (ConstraintLayout.LayoutParams)button1.getLayoutParams();
        layoutParams.topMargin = 8;
        layoutParams.rightMargin = 16;
        layoutParams.startToStart = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.endToEnd = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.topToTop = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.bottomToBottom = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.verticalBias = (float) 0.1;
        layoutParams.horizontalBias = (float) 0.1;
        button1.setLayoutParams(layoutParams);

        // Button2の設定
        layoutParams = (ConstraintLayout.LayoutParams)button2.getLayoutParams();
        layoutParams.leftMargin = 16;
        layoutParams.startToEnd = button1.getId();
        layoutParams.endToEnd = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.topToTop = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.bottomToBottom = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.verticalBias = (float)0.1;
        layoutParams.horizontalBias = 0;
        button2.setLayoutParams(layoutParams);
    }
}

実行例

さらに

ConstraintSetを使うと同じ様に設定できるらしい.

Kotlin(Java)コード上でConstraintLayoutの制約を編集する

が、この方法だと、Biasが設定できない?

また、Viewが実際に配置される(?)まで、そのIDが取得できないみたいなので、注意が必要.
実際に、上の適用例を次のようにしてみる.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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/constraintLayoutParamsLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.blogspot.ko-ika.constraintlayoutparams.MainActivity">

</android.support.constraint.ConstraintLayout>

activity_main.xml

        

        Button button1 = new Button(this);
        Button button2 = new Button(this);
        ConstraintLayout constraintLayout = findViewById(R.id.constraintLayoutParamsLayout); 

        // Button1の設定
        constraintLayout.addView(button1);
        button1.setText("Button1"); 
        ConstraintLayout.LayoutParams layoutParams = (ConstraintLayout.LayoutParams)button1.getLayoutParams();
        layoutParams.topMargin = 8;
        layoutParams.rightMargin = 16;
        layoutParams.startToStart = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.endToEnd = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.topToTop = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.bottomToBottom = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.verticalBias = (float) 0.1;
        layoutParams.horizontalBias = (float) 0.1;
        button1.setLayoutParams(layoutParams);

        // Button2の設定
        constraintLayout.addView(button2);
        button2.setText("Button2"); 
        layoutParams = (ConstraintLayout.LayoutParams)button2.getLayoutParams();
        layoutParams.leftMargin = 16;
        layoutParams.startToEnd = button1.getId();
        layoutParams.endToEnd = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.topToTop = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.bottomToBottom = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.verticalBias = (float)0.1;
        layoutParams.horizontalBias = 0;
        button2.setLayoutParams(layoutParams);

変更箇所をマークアップした. すると、次のようになってしまう.

参考にしたサイト

ConstraintLayout.LayoutParams | Android Developers

removeViewが動かない

ViewGroup#removeViewメソッドの引数がnullでないのにnullだったため、動かなくなった.

まず、引数がnullかどうか確かめよう(引数をnullにしても例外が発生しないので気づかなかった).
以下の方法は、消去したいViewに変数を割り当てなくてもできる方法である

コードは以下のようである.

parentLinearLayout.removeView(childLinearLayout);

どうも描画中のアニメーションのせいで、動かないらしい.

RemoveView not working

上記サイトの方法だと、LinearLayoutを継承したクラスを作って、削除するときのアニメーションを表示させないようにしているようだ.

この方法だとかなりの手間がかかりそうだったので、代わりにViewGroup#removeViewAtメソッドを使ったところ、うまくいった.

parentLinearLayout.removeViewAt(index);

indexとしてchildLinearLayoutのポジションを指定する.

ちなみに、子Viewのindexを取得するには、ViewGroup#indexOfChildメソッドを使う.

int index = parentLinearLayout.indexOfChild(childLinearLayout);

参考にしたサイト

ViewGroup | Android Developers

登録: 投稿 (Atom)

さきいかの備忘録

Parcelabeと実行時エラー

Parcelableを実装するときの注意

Parcelableでデータを受渡しするときの注意

参考にしたサイト

RecyclerView in NestedScrollViewでスクロールが角つく

参考にしたサイト

CheckBoxのチェックボックスを右側に表示させる。

API 17以上の場合

API 17未満の場合

参考にしたサイト

BloggerにSyntaxHighlighterを導入する!

導入する！

その0

その1

その2

その3

--brushes

--theme

使用例

その4

その5

その6

使用方法・注意点

参考にしたサイト

ColorFilterを元に戻す

参考にしたウェブサイト

ConstraintLayoutの制約をJavaで設定する

適用例

さらに

参考にしたサイト

removeViewが動かない

参考にしたサイト

FloatingActionButtonをスクロール中に消す