手軽にチュートリアルが組み込めるAndroidのライブラリ、MaterialShowcaseViewを使ってみる。
こちらのライブラリは、アプリをインストールして起動後に1回だけチュートリアルが実行される仕組みです。2回目からは、アンインストールしないと表示されないので注意してください。
いつもの
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(); } }