読者です 読者をやめる 読者になる 読者になる

さまよえる、Android

Androidのプログラミングで便利なことや残しておきたいことを残しておく。もしオススメのライブラリがあったら教えてくださいね。

手軽にチュートリアルが組み込めるAndroidのライブラリ、MaterialShowcaseViewを使ってみる。

Android UI マテリアルデザイン

github.com

こちらのライブラリは、アプリをインストールして起動後に1回だけチュートリアルが実行される仕組みです。2回目からは、アンインストールしないと表示されないので注意してください。


f:id:araiyusukej:20151028175444p:plain

f:id:araiyusukej:20151028175453p:plain

f:id:araiyusukej:20151028175500p:plain

いつもの

    compile 'com.github.deano2390:MaterialShowcaseView:1.0.5@aar'

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:padding="30dp">

        <TextView
            android:id="@+id/nameTv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="ユーザーID" />

        <EditText
            android:id="@+id/nameEt"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />

        <TextView
            android:id="@+id/passwordTv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="パスワード" />

        <EditText
            android:id="@+id/passwordEt"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />

    </LinearLayout>


    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true">

        <Button
            android:id="@+id/loginBtn"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="ログイン" />

        <Button
            android:id="@+id/clearBtn"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="クリア" />
    </LinearLayout>
</RelativeLayout>
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.Button;
import android.widget.TextView;

import uk.co.deanwild.materialshowcaseview.MaterialShowcaseSequence;
import uk.co.deanwild.materialshowcaseview.ShowcaseConfig;

public class MainActivity extends AppCompatActivity {

    private static final String SHOWCASE_ID = "sequence example";
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        TextView first = (TextView) findViewById(R.id.nameTv);
        TextView second = (TextView) findViewById(R.id.passwordTv);
        Button third = (Button) findViewById(R.id.clearBtn);
        ShowcaseConfig config = new ShowcaseConfig();
        config.setDelay(500);
        MaterialShowcaseSequence sequence = new MaterialShowcaseSequence(this, SHOWCASE_ID);
        sequence.setConfig(config);
        sequence.addSequenceItem(first,
                "ユーザーIDは、半角アルファベット10文字で入力してください。", "次へ");
        sequence.addSequenceItem(second,
                "パスワードは忘れずに", "次へ");
        sequence.addSequenceItem(third,
                "クリアボタンを押すとフォームを空にできます。", "開始する");
        sequence.start();

    }
}