Android プログラミング【バックミュージックの追加】 ~オブジェクト指向・予習編~

Android プログラミング【バックミュージックの追加】 ~オブジェクト指向・予習編~

バックミュージックの追加① ~オブジェクト指向・予習編~ 768

続編・Android プログラミング【バックミュージックの追加 ② 】 ~オブジェクト指向・予習編~

この動画は「オブジェクト指向でアプリを組める!」を目指す学習動画です。

オブジェクト指向自体は簡単で大したことではありません。

しかし、それなりの慣れや経験が無いと意味不明です。
つまり「頭で理解するのは難しいが、慣れるのは簡単」だと思ってます。

まずは深く考えずに「予習」をしてみたいと思います。

アプリ作成

プログラムも分担

プロジェクト、カンパニードメイン、パッケージネームを同じにするとコピペエラーが減ります。

Application name Test
Company Domain test.com
Package name com.test.test

オブジェクト指向 新規プロジェクト

  1. mp3ファイルの準備
  2. javaファイルの準備
  3. MainActivity.javaの編集

以下のファイルとmp3を用意して、指定の場所に保存してください。
※ 慣れてない方はファイル名、フォルダ名を同じにしてください。

・音楽素材 MusMus様
JavaファイルのDL

オブジェクト指向-ファイル保存2

バックミュージック-指示通りに記載

package com.test.test;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class MainActivity extends AppCompatActivity {

    MyMedia myMedia = new MyMedia();    // ① 準備

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

        myMedia.onCreate( this,R.raw.main); // ②読込
    }

    @Override
    protected void onResume() {
        super.onResume();
        myMedia.onResume(); // ③再生
    }
    @Override
    protected void onPause() {
        super.onPause();
        myMedia.onPause(); // ④ 一時停止
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        myMedia.onDestroy(); // ⑤ 終了
    }
}

バックミュージック-ポイント

Android プログラミング【 カウントダウンタイマー④ 】~ 改正版 ~

Android プログラミング【 カウントダウンタイマー④ 】~ 改正版 ~768
カウントダウンタイマーを利用した「アプリサンプル」です。
パズルや脳トレアプリをイメージして、タイトル画面→プレイ画面→終了画面 の流れを作成します。

【 注意事項 】
この動画にはシリーズ物です以下から順にご覧ください。

カウントダウンタイマー① 10秒で終了
カウントダウンタイマー② 画面切り替え
カウントダウンタイマー③ 画面再表示
カウントダウンタイマー④ 改正版

タイマーアプリ 画面の流れ

プロジェクト、カンパニードメイン、パッケージネームを同じにするとコピペエラーが減ります。

Application name TestGame
Company Domain test.com
Package name com.test.testgame

カウントダウンタイマー新規作成

カウントダウンタイマー ファイル構成

カウントダウンタイマー-タイトル画面

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.test.testgame.MainActivity">

    <Button
        android:onClick="onStart"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="start"
        android:textSize="30sp" />

</RelativeLayout>

カウントダウンタイマー-プレイ画面

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_play"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.test.testgame.PlayActivity">

    <TextView
        android:id="@+id/tv"
        android:layout_alignParentRight="true"
        android:text="あと10秒"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</RelativeLayout>

カウントダウンタイマー リザルト画面

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_result"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.test.testgame.ResultActivity">

    <TextView
        android:layout_centerHorizontal="true"
        android:textSize="40sp"
        android:text="ゲームオーバー"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</RelativeLayout>
package com.test.testgame;

import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;

public class MainActivity extends AppCompatActivity {

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

    // STRATボタンクリック
    public void onStart( View v){
        // 画面切り替え
        Intent intent = new Intent(this,PlayActivity.class); 
        startActivity(intent);
    }
}
package com.test.testgame;

import android.content.Intent;
import android.os.CountDownTimer;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.TextView;

public class PlayActivity extends AppCompatActivity {

    CountDownTimer countDownTimer;  // タイマー本体
    long time = 10000;              // タイマー終了時間

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

    // 画面再表示に実行 //////////////////////////////////
    @Override
    protected void onResume() {
        super.onResume();
        countDownTimer = new CountDownTimer(time, 100) {
            @Override
            public void onTick(long millisUntilFinished) {
                // 0.1秒毎にTextView更新
                time = millisUntilFinished;
                int t = (int) millisUntilFinished / 1000;
                ((TextView) findViewById(R.id.tv)).setText("あと" + t + "秒");
            }

            @Override
            public void onFinish() {
                // 画面を切り替え
                Intent intent = new Intent(PlayActivity.this, ResultActivity.class);
                startActivity(intent);
                // PlayActivity終了
                finish();
            }
        }.start();
    }

    // 画面非表示に実行 ////////////////////////////////
    @Override
    protected void onPause() {
        super.onPause();
        countDownTimer.cancel();
        countDownTimer = null;
    }
}
package com.test.testgame;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class ResultActivity extends AppCompatActivity {

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

Android プログラミング【 カウントダウンタイマー③ 】~ 画面再表示 ~

Android 開発 カウントダウンタイマー3 768

【 注意事項 】
この動画にはシリーズ物です以下から順にご覧ください。

カウントダウンタイマー① 10秒で終了
カウントダウンタイマー② 画面切り替え
カウントダウンタイマー③ 画面再表示
カウントダウンタイマー④ 改正版

プロジェクト、カンパニードメイン、パッケージネームを同じにするとコピペエラーが減ります。

Application name MyCountDown
Company Domain test.com
Package name com.test.mycountdown

新規プロジェクト

activity_main_xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.test.mycountdown.MainActivity">

    <TextView
        android:id="@+id/tv"
        android:textSize="30sp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!" />
</RelativeLayout>

package com.test.mycountdown;

import android.content.Intent;
import android.os.Bundle;
import android.os.CountDownTimer;
import android.support.v7.app.AppCompatActivity;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity{

    CountDownTimer countDownTimer;  // タイマー本体
    long alltime = 10000;              // タイマー終了時間

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

    
    // 画面非表示に実行 ////////////////////////////////
    @Override
    protected void onPause() {
        super.onPause();
        countDownTimer.cancel();
        countDownTimer = null;
    }

    // 画面再表示に実行 //////////////////////////////////
    @Override
    protected void onResume() {
        super.onResume();
        countDownTimer = new CountDownTimer(alltime, 100) {
            @Override
            public void onTick(long millisUntilFinished) {
                alltime= millisUntilFinished;
                int time = (int)millisUntilFinished /1000;
                ((TextView)findViewById(R.id.tv)).setText("あと" + time + "秒");
            }
            @Override
            public void onFinish() {
                Intent intent = new Intent(MainActivity.this,Main2Activity.class);
                startActivity(intent);
            }
        }.start();
    }
}

Android プログラミング【 カウントダウンタイマー② 】~ 10秒で画面切り替え ~

Android 開発 カウントダウンタイマー2 768

【 注意事項 】
この動画には問題点もあります。
以下から順にご覧ください。

カウントダウンタイマー① 10秒で終了
カウントダウンタイマー② 画面切り替え
カウントダウンタイマー③ 画面再表示
カウントダウンタイマー④ 改正版

プロジェクト、カンパニードメイン、パッケージネームを同じにするとコピペエラーが減ります。

Application name MyCountDown
Company Domain test.com
Package name com.test.mycountdown

新規プロジェクト

activity_main_xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.test.mycountdown.MainActivity">

    <TextView
        android:id="@+id/tv"
        android:textSize="30sp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!" />
</RelativeLayout>

終了時の画面(アクティビティ)を追加し、TextViewを記載します。

activity_main2_xml図解

CountDownTimer 図解①

package com.test.mycountdown;

import android.content.Intent;
import android.os.Bundle;
import android.os.CountDownTimer;
import android.support.v7.app.AppCompatActivity;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity{

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

        CountDownTimer countDownTimer = new CountDownTimer(10000, 100) {

            @Override
            public void onTick(long millisUntilFinished) {
                int time = (int)millisUntilFinished /1000;
                ((TextView)findViewById(R.id.tv)).setText("あと" + time + "秒");
            }

            @Override
            public void onFinish() {
                Intent intent = new Intent(MainActivity.this,Main2Activity.class);
                startActivity(intent);
            }
        }.start();
    }

}

Android プログラミング【 カウントダウンタイマー① 】~ 10秒で終了 ~

Android 開発 カウントダウンタイマー1

カウントダウンタイマーを学習します。
細かく理解するには「Java中級」程度の知識が必要ですが、再現だけならカンタンです。

【 注意事項 】
この動画には問題点もあります。
以下と組み合わせてご覧ください。

カウントダウンタイマー① 10秒で終了
カウントダウンタイマー② 画面切り替え
カウントダウンタイマー③ 画面再表示
カウントダウンタイマー④ 改正版

プロジェクト、カンパニードメイン、パッケージネームを同じにするとコピペエラーが減ります。

Application name MyCountDown
Company Domain test.com
Package name com.test.mycountdown

新規プロジェクト

activity_main_xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.test.mycountdown.MainActivity">

    <TextView
        android:id="@+id/tv"
        android:textSize="30sp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!" />
</RelativeLayout>

MainActivity_java

package com.test.mycountdown;

import android.os.Bundle;
import android.os.CountDownTimer;
import android.support.v7.app.AppCompatActivity;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity{
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        CountDownTimer countDownTimer = new CountDownTimer(10000, 100) {
            @Override
            public void onTick(long millisUntilFinished) {
                int time = (int)millisUntilFinished /1000;
                ((TextView)findViewById(R.id.tv)).setText("あと" + time + "秒");
            }
            @Override
            public void onFinish() {
                finish();
            }
        }.start();
    }
}

CountDownTimer 図解①

15分で作る? 【4択クイズ 】~ 小さい順にタップ ~

15分で作る? 【4択クイズ 】~ 小さい順にタップ ~

Android 開発【 4択クイズ① 】画面作成編 768

簡易4択クイズです。
少ない順にタップし、全てタップするとゲームクリアーです。

学習用のサンプルアプリです。
ゲームオーバーやリトライはありませんし、説明も簡略しています。

以下の知識が無いと理解不能です。
初心者のかたは「ご自身のPCで再現」を目指してください。

  • 配列
  • IF
  • キャスト
  • ジェネリクス
  1. 【4択クイズ① 】~ 画面作成編 ~
  2. 【4択クイズ② 】~ ランダム出題編 ~
  3. 【4択クイズ③ 】~ 正解判定編 ~
  4. 【4択クイズ④ 】~ ゲームオーバー ~
  5. 【4択クイズ⑤ 】~ 完成編 ~

プロジェクト、カンパニードメイン、パッケージネームを同じにするとコピペエラーが減ります。

Application name ForeQuiz
Company Domain test.com
Package name com.test.forequiz

クイズの作り方【プロジェクト名】

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="小さい順にタップ"
        android:textSize="40sp" />

    <Button
        android:id="@+id/b0"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:onClick="onButton"
        android:text="○"
        android:textSize="30sp" />

    <Button
        android:id="@+id/b1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:onClick="onButton"
        android:text="○"
        android:textSize="30sp" />

    <Button
        android:id="@+id/b2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:onClick="onButton"
        android:text="○"
        android:textSize="30sp" />

    <Button
        android:id="@+id/b3"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:onClick="onButton"
        android:text="○"
        android:textSize="30sp" />
</LinearLayout>
package com.test.forequiz;

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

import java.util.Arrays;
import java.util.Collections;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    String[] QUIZ = {"アリ","ネズミ","ゴリラ","クジラ"};  // 問題

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

        // 出題(シャッフル)//////////////////////////
        List<String> list = Arrays.asList(QUIZ.clone());
        Collections.shuffle(list);
        ((Button)findViewById(R.id.b0)).setText(list.get(0));
        ((Button)findViewById(R.id.b1)).setText(list.get(1));
        ((Button)findViewById(R.id.b2)).setText(list.get(2));
        ((Button)findViewById(R.id.b3)).setText(list.get(3));
    }
    
}
package com.test.forequiz;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

import java.util.Arrays;
import java.util.Collections;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    String[] QUIZ = {"アリ","ネズミ","ゴリラ","クジラ"};  // 問題
    int tap = 0;                             // 現在の正解数

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

        // 出題(シャッフル)//////////////////////////
        List<String> list = Arrays.asList(QUIZ.clone());
        Collections.shuffle(list);
        ((Button)findViewById(R.id.b0)).setText(list.get(0));
        ((Button)findViewById(R.id.b1)).setText(list.get(1));
        ((Button)findViewById(R.id.b2)).setText(list.get(2));
        ((Button)findViewById(R.id.b3)).setText(list.get(3));
    }

    // ボタンチェック  /////////////////////////
    public void onButton( View v){
        // タップされたボタンの文字を取得
        String text =  ((Button)v).getText().toString();

        // 正解処理 ( 問題と比較 )
        if( text.equals(QUIZ[tap])){

            v.setEnabled(false);    // ボタンをクリック不可
            tap++;                  // 正解数UP
            ((TextView)findViewById(R.id.tv)).setText( tap+"問正解!!");  // 正解表示
            
        }
    }
}
package com.test.forequiz;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

import java.util.Arrays;
import java.util.Collections;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    String[] QUIZ = {"アリ","ネズミ","ゴリラ","クジラ"};  // 問題
    int tap = 0;                             // 現在の正解数

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

        // 出題(シャッフル)//////////////////////////
        List<String> list = Arrays.asList(QUIZ.clone());
        Collections.shuffle(list);
        ((Button)findViewById(R.id.b0)).setText(list.get(0));
        ((Button)findViewById(R.id.b1)).setText(list.get(1));
        ((Button)findViewById(R.id.b2)).setText(list.get(2));
        ((Button)findViewById(R.id.b3)).setText(list.get(3));
    }

    // ボタンチェック  /////////////////////////
    public void onButton( View v){
        // タップされたボタンの文字を取得
        String text =  ((Button)v).getText().toString();

        // 正解処理 ( 問題と比較 )
        if( text.equals(QUIZ[tap])){

            v.setEnabled(false);    // ボタンをクリック不可
            tap++;                  // 正解数UP
            ((TextView)findViewById(R.id.tv)).setText( tap+"問正解!!");  // 正解表示
            
        }
        // 不正解処理
        else {
            ((TextView)findViewById(R.id.tv)).setText("ゲームオーバー");
            ((Button)findViewById(R.id.b0)).setEnabled(false);
            ((Button)findViewById(R.id.b1)).setEnabled(false);
            ((Button)findViewById(R.id.b2)).setEnabled(false);
            ((Button)findViewById(R.id.b3)).setEnabled(false);
        }
    }
}

package com.test.forequiz;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

import java.util.Arrays;
import java.util.Collections;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    String[] QUIZ = {"アリ","ネズミ","ゴリラ","クジラ"};  // 問題
    int tap = 0;                             // 現在の正解数

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

        // 出題(シャッフル)//////////////////////////
        List<String> list = Arrays.asList(QUIZ.clone());
        Collections.shuffle(list);
        ((Button)findViewById(R.id.b0)).setText(list.get(0));
        ((Button)findViewById(R.id.b1)).setText(list.get(1));
        ((Button)findViewById(R.id.b2)).setText(list.get(2));
        ((Button)findViewById(R.id.b3)).setText(list.get(3));
    }

    // ボタンチェック  /////////////////////////
    public void onButton( View v){
        // タップされたボタンの文字を取得
        String text =  ((Button)v).getText().toString();

        // 正解処理 ( 問題と比較 )
        if( text.equals(QUIZ[tap])){

            v.setEnabled(false);    // ボタンをクリック不可
            tap++;                  // 正解数UP
            ((TextView)findViewById(R.id.tv)).setText( tap+"問正解!!");  // 正解表示

            // 全問正解の処理
            if(tap >= 4){
                ((TextView)findViewById(R.id.tv)).setText("ゲームクリア");
            }
        }
        // 不正解処理
        else {
            ((TextView)findViewById(R.id.tv)).setText("ゲームオーバー");
            ((Button)findViewById(R.id.b0)).setEnabled(false);
            ((Button)findViewById(R.id.b1)).setEnabled(false);
            ((Button)findViewById(R.id.b2)).setEnabled(false);
            ((Button)findViewById(R.id.b3)).setEnabled(false);
        }
    }
}
15分で作る?【 動画の再生 】~選択再生~

15分で作る?【 動画の再生 】~選択再生~

Android 開発【動画の再生】 選択再生768

一覧から選んで動画を再生します。

今回は「画面の切り替え」を行います。
ActivityとIntentを理解していると簡単な動画ですが、初心者の方はほぼ理解不可能な動画です。
「ご自身のPCで再現」「ActivityとIntentの予習」として御覧ください。

初心者 :ご自身のPCで再現できるが、詳細は意味不明、アレンジも厳しい。
中級者 :再現と「なんとなく」理解可能。アレンジは厳しい。
経験者 :ActivityとIntentを理解してれば、ソースを見るだけで理解可能。

動画の再生【画面構成】

学習に使用する素材です。
ご自身で用意する場合はファイル名や拡張し、ファイルサイズにご注意ください。
初心者の方はサンプルを使用することを強くおすすめします。

ImageButton ニワトリ
iv0
ImageButton 犬
iv1
ImageButton 猫
iv2

※ 写真素材は【 写真素材ぱくたそ 】様からお借りしています。

サンプル動画 【ミニカー】

サンプル動画 【シャカシャカ】

サンプル動画 【ひよこ】

* 注意点:動画の形式によって再生できないものがありました。

プロジェクト、カンパニードメイン、パッケージネームを同じにするとコピペエラーが減ります。

Application name MyVideo
Company Domain test.com
Package name com.test.myvideo

Android 開発【動画プレーヤー】プロジェクト名

以下のファイル構成になります。
フォルダ名やファイル名を変更するとエラーになります。

ファイル構成2

一覧画面を完成させます。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <ImageView
        android:src="@drawable/iv0"
        android:onClick="iv0"
        android:layout_weight="1"
        android:scaleType="centerCrop"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    <ImageView
        android:src="@drawable/iv1"
        android:onClick="iv1"
        android:layout_weight="1"
        android:scaleType="centerCrop"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    <ImageView
        android:src="@drawable/iv2"
        android:onClick="iv2"
        android:layout_weight="1"
        android:scaleType="centerCrop"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</LinearLayout>

一覧画面のプログラムを作成します。

package com.test.myvideo;

import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;

public class MainActivity extends AppCompatActivity {

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

    // ボタンクリック
    public void iv0(View v) {

        // 画面移行の準備
        Intent intent = new Intent(this, Main2Activity.class);
        // 移行後に再生する動画を指定
        intent.putExtra("mp4", R.raw.video0);
        // 画面移行スタート
        startActivity(intent);
    }

    public void iv1(View v) {
        Intent intent = new Intent(this, Main2Activity.class);
        intent.putExtra("mp4", R.raw.video1);
        startActivity(intent);
    }

    public void iv2(View v) {
        Intent intent = new Intent(this, Main2Activity.class);
        intent.putExtra("mp4", R.raw.video2);
        startActivity(intent);
    }

}
<?xml version="1.0" encoding="utf-8"?>
<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">

    <VideoView
        android:id="@+id/v"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</RelativeLayout>
package com.test.myvideo;

import android.content.Intent;
import android.net.Uri;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.MediaController;
import android.widget.VideoView;

public class Main2Activity extends AppCompatActivity {

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

        // 元の画面で指定した動画を取得
        Intent intent = getIntent();
        int mp4 = intent.getIntExtra("mp4",R.raw.video1);

        // ID取得
        VideoView v = (VideoView)findViewById(R.id.v);

        // 動画の指定
        v.setVideoURI(Uri.parse("android.resource://" + this.getPackageName() + "/" + mp4));

        // 再生スタート
        v.start();

        // コントローラNO(動画をタップするとメニュー表示)
        v.setMediaController(new MediaController(this));
    }
}


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

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme" >
        <activity android:name=".MainActivity" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name=".Main2Activity" >
        </activity>
    </application>

</manifest>

15分で作る?  【バイブレーション②】~ 停止処理 ~

15分で作る? 【バイブレーション②】~ 停止処理 ~

Android Studio 入門【停止処理】タイトル768

バイブレーションの停止処理を追加します。
通常の停止処理だけでなく、トラブル時の対応も追加しています。

この動画はシリーズ物です。以下の順にご覧ください。

  1. 【バイブレーション①】~ 基礎編 ~
  2. 【バイブレーション②】~ 停止処理 ~
  3. 【バイブレーション③】~ リズム版 ~
  4. 【バイブレーション④】~ チェック版 ~

バイブレーションの停止もとても簡単です。
以下の1行を適切な場所に張付けるだけで停止することが出来ます。

((Vibrator) getSystemService(Context.VIBRATOR_SERVICE)).cancel();

前回と全く一緒ですので変更は不要です。

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

    <uses-permission android:name="android.permission.VIBRATE" />
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

画面中央にボタンを配置します。
バイブレーションのスタートボタンになります。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity">

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="onStart"
        android:text="START"
        android:textSize="50dp" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="onStop"
        android:text="STOP"
        android:textSize="50dp" />
    
</LinearLayout>

ボタンクリック時にバイブレーションが鳴ります。
本体の「バイブレーション有無」はチェックしていません。

package com.test.vibration;

import android.content.Context;
import android.os.Vibrator;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;

public class MainActivity extends AppCompatActivity {

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

    // STARTボタン    //////////////////////////////////
    public void onStart(View v) {
        // バイブレーションスタート(1秒:1000ミリ秒)
        ((Vibrator) getSystemService(Context.VIBRATOR_SERVICE)).vibrate(10000);
    }

    // STOPボタン    //////////////////////////////////
    public void onStop(View v) {
        // キャンセル処理
        ((Vibrator) getSystemService(Context.VIBRATOR_SERVICE)).cancel();
    }


    // 強制停止処理   //////////////////////////////////
    @Override
    protected void onPause() {
        super.onPause();
        // キャンセル処理
        ((Vibrator) getSystemService(Context.VIBRATOR_SERVICE)).cancel();
    }
}

15分で作る?【 アニメストップウォッチ 】~パラパラアニメ~

15分で作る?【 アニメストップウォッチ 】~パラパラアニメ~

Android 開発 【ストップウォッチ2】1367

以前公開した【 簡易ストップウォッチ 】にパラパラアニメを連動させる方法です。

難易度:★★★★☆
・コピペでの再現は可能
・詳細の理解やアレンジは難しい

動画では「簡易的な解説」ですませ、皆さんの「PCで再現」を目指します。
理解やアレンジには、相当なスキルが必要ですので「RPGで学ぶ」や市販テキストの学習をオススメします。

Android アプリ【タイトル素材】
cat0
Android アプリ【パラパラアニメ素材2】
cat2
Android アプリ【パラパラアニメ素材1】
cat1
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <Chronometer
        android:id="@+id/c"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="60sp" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="onStart"
        android:text="スタート"
        android:textSize="40sp" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="onStop"
        android:text="ストップ"
        android:textSize="40sp" />

    <ImageView
        android:id="@+id/iv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="centerCrop"
        android:src="@drawable/cat0" />

</LinearLayout>
package com.hakoniwadesign.stopwatch;

import android.os.SystemClock;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Chronometer;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity  {

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

    // スタート
    public void onStart(View v) {
        ((Chronometer)findViewById(R.id.c)).setBase(SystemClock.elapsedRealtime());
        ((Chronometer)findViewById(R.id.c)).start();

        // 画像変更
        ((ImageView)findViewById(R.id.iv)).setImageResource(R.drawable.cat1);
    }

    // ストップ
    public void onStop(View v) {
        ((Chronometer)findViewById(R.id.c)).stop();
        ((ImageView)findViewById(R.id.iv)).setImageResource(R.drawable.cat0);
    }
}
package com.hakoniwadesign.stopwatch;

import android.os.SystemClock;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Chronometer;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {

    int x = 0;  // 表示回数カウント

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

    // スタート
    public void onStart( View v ){
        ((Chronometer)findViewById(R.id.c)).setBase(SystemClock.elapsedRealtime());
        ((Chronometer)findViewById(R.id.c)).start();

        // 条件分析
        x++;    // xを+1させる
        if( x % 2 ==0 ) {   // 偶数ですか?
            // YESの場合
            ((ImageView) findViewById(R.id.iv)).setImageResource(R.drawable.cat1);
        }else {
            // NOの場合
            ((ImageView) findViewById(R.id.iv)).setImageResource(R.drawable.cat2);
        }
    }

    // ストップ
    public void onStop( View v ){
        ((Chronometer)findViewById(R.id.c)).stop();
        ((ImageView)findViewById(R.id.iv)).setImageResource(R.drawable.cat0);
    }
}

package com.hakoniwadesign.stopwatch;

import android.os.SystemClock;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Chronometer;
import android.widget.ImageView;

// 定期的処理① メソッドの使用宣言
public class MainActivity extends AppCompatActivity implements Chronometer.OnChronometerTickListener {

    int x = 0;  // 表示回数カウント

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

    // スタート
    public void onStart( View v ){
        ((Chronometer)findViewById(R.id.c)).setBase(SystemClock.elapsedRealtime());
        ((Chronometer)findViewById(R.id.c)).start();

        // 定期的処理③ 処理のスタート
        ((Chronometer)findViewById(R.id.c)).setOnChronometerTickListener(this);
    }

    // ストップ
    public void onStop( View v ){
        ((Chronometer)findViewById(R.id.c)).stop();
        ((ImageView)findViewById(R.id.iv)).setImageResource(R.drawable.cat0);
    }

    // 定期的処理② 約1秒毎に実行する具体的処理
    @Override
    public void onChronometerTick(Chronometer chronometer) {
        // 条件分析
        x++;    // xを+1させる
        if( x % 2 ==0 ) {   // 偶数ですか?
            // YESの場合
            ((ImageView) findViewById(R.id.iv)).setImageResource(R.drawable.cat1);
        }else {
            // NOの場合
            ((ImageView) findViewById(R.id.iv)).setImageResource(R.drawable.cat2);
        }
    }
}
簡易ミュージックアプリ

簡易ミュージックアプリ

アンドロイドアプリ作成の「複数のバックミュージック再生」を解説しているページです。
アンドロイドアプリの作り方「簡易ミュージックアプリ」
  • 内  容 :複数曲の再生と停止 「バックミュージックの再生」の続編
  • 難 易 度 :★★★★☆ ( 未経験者の理解、応用は難しいので、再現できるを目指す )
  • 予備知識 :変数、メソッド、IF関数、IDの理解、XML
  • 注  意 :開発ソフトのバージョンやPCの環境によって正常に機能しないときがあります。
  • 補  足 :2015/02/11現在、Android StudioとEclipseの両方で対応。
  1. はじめに → YouTube
  2. 素材の用意 → YouTube
  3. レイアウト作成 → YouTube
  4. 画像の変更 → YouTube
  5. 1曲の再生と停止 → YouTube
  6. 複数曲の再生と停止 → YouTube
  7. Android Studioで復習 → YouTube
動画で学ぶアンドロイドアプリ 【簡易ミュージック】 jazz
jazz(停止中)
動画で学ぶアンドロイドアプリ 【簡易ミュージック】 lock
lock(停止中)
動画で学ぶアンドロイドアプリ 【簡易ミュージック】 pops
pops (停止中)
動画で学ぶアンドロイドアプリ 【簡易ミュージック】 jazz2
jazz2 (再生中)
動画で学ぶアンドロイドアプリ 【簡易ミュージック】 lock2
lock2 (再生中)
動画で学ぶアンドロイドアプリ 【簡易ミュージック】 pops2
pops2 (再生中)

利用サイト様 :Music is VFR

mp3ファイルを3曲用意してください。
極端に長い曲、短い曲、容量の大きい曲以外でしたら問題ありません。
フォルダ名、ファイル名は全て小文字で以下と全く同じにしてください。

  • raw (フォルダ)
    • jazz.mp3
    • lock.mp3
    • pops.mp3
アンドロイドアプリの作り方-【-簡易ミュージックアプリ-】-保存場所
保存場所

※ ファイル名、フォルダ名は完全に一致してください。1文字でも違うとエラーです。

アプリ名[Eclipseの場合]
エクリプスの場合

アプリ名[アンドロイドスタジオの場合]
アンドロイド スタジオの場合
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/pops"
        android:src="@drawable/pops"
        android:layout_weight="1"
        android:scaleType="centerCrop"
        android:onClick="pops"/>

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/lock"
        android:src="@drawable/lock"
        android:layout_weight="1"
        android:onClick="lock"
        android:scaleType="centerCrop" />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/jazz"
        android:layout_gravity="center_vertical"
        android:src="@drawable/jazz"
        android:layout_weight="1"
        android:onClick="jazz"
        android:scaleType="centerCrop" />

</LinearLayout>

XMLの解説図です。詳しくは動画をご覧ください。

アンドロイドアプリの作り方【ミュージックアプリ】XML解説
XML解説
package com.test.soundtest;

import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.View; // インポート
import android.widget.ImageView; // インポート


public class MainActivity extends ActionBarActivity {

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

    /* ******************************************
    * クリック処理 (pops画像)
    ****************************************** */
    public void pops(View v) {
        // 画像の変更
        ((ImageView) findViewById(R.id.pops)).setImageResource(R.drawable.pops2);
        ((ImageView) findViewById(R.id.lock)).setImageResource(R.drawable.lock);
        ((ImageView) findViewById(R.id.jazz)).setImageResource(R.drawable.jazz);
    }

    /* ******************************************
    * クリック処理 (lock画像)
    ****************************************** */
    public void lock(View v) {
        ((ImageView) findViewById(R.id.pops)).setImageResource(R.drawable.pops);
        ((ImageView) findViewById(R.id.lock)).setImageResource(R.drawable.lock2);
        ((ImageView) findViewById(R.id.jazz)).setImageResource(R.drawable.jazz);
    }

    /* ******************************************
    * クリック処理 (jazz画像)
    ****************************************** */
    public void jazz(View v) {
        ((ImageView) findViewById(R.id.pops)).setImageResource(R.drawable.pops);
        ((ImageView) findViewById(R.id.lock)).setImageResource(R.drawable.lock);
        ((ImageView) findViewById(R.id.jazz)).setImageResource(R.drawable.jazz2);
    }
}

注意点!!

サンプルを適切にコピペすることで動作しますが・・・・意外と難しいです。

1文字違い、1行違うだけでアウトです。
以下を意識しながら確してください。

  • 記載場所 : {}や;より前か後ろか?
  • 文字の違い : 大文字と小文字 、全角と半角
  • コピー範囲  : 最後の;が入っているか?
  • ファイル名  : ファイル名、フォルダ名が1文字でもちがうと正常に動作しません
package com.test.soundtest;

import android.media.MediaPlayer;    // 再生の準備
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.View; // インポート
import android.widget.ImageView; // インポート


public class MainActivity extends ActionBarActivity {

    // 再生の準備   //////////////////////
    MediaPlayer p;  // 再生に必要なファイルの読み込み

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

    /* ******************************************
    * クリック処理 (pops画像)
    ****************************************** */
    public void pops(View v) {
        // 画像の変更
        ((ImageView) findViewById(R.id.pops)).setImageResource(R.drawable.pops2);
        ((ImageView) findViewById(R.id.lock)).setImageResource(R.drawable.lock);
        ((ImageView) findViewById(R.id.jazz)).setImageResource(R.drawable.jazz);

        // 再生中なら停止
        if (p != null && p.isPlaying()) {
            p.stop(); // 停止
            p.release();// メモリの解放
        }

        // mp3の読み込み
        p = MediaPlayer.create(getApplicationContext(), R.raw.pops);
        p.setLooping(true);  // 連続再生設定
        p.start(); // 再生
    }

    /* ******************************************
    * クリック処理 (lock画像)
    ****************************************** */
    public void lock(View v) {
        ((ImageView) findViewById(R.id.pops)).setImageResource(R.drawable.pops);
        ((ImageView) findViewById(R.id.lock)).setImageResource(R.drawable.lock2);
        ((ImageView) findViewById(R.id.jazz)).setImageResource(R.drawable.jazz);
    }

    /* ******************************************
    * クリック処理 (jazz画像)
    ****************************************** */
    public void jazz(View v) {
        ((ImageView) findViewById(R.id.pops)).setImageResource(R.drawable.pops);
        ((ImageView) findViewById(R.id.lock)).setImageResource(R.drawable.lock);
        ((ImageView) findViewById(R.id.jazz)).setImageResource(R.drawable.jazz2);
    }

    /* ******************************************
    * アプリの終了
    ****************************************** */
    @Override
    protected void onDestroy() {
        super.onDestroy();
        // クリア可能か確認
        if (p != null) {
            p.release();// メモリの解放
            p = null; // 最初に読み込んだファイルのクリア
        }
    }
}

package com.test.soundtest;

import android.media.MediaPlayer;    // 再生の準備
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.View; // インポート
import android.widget.ImageView; // インポート


public class MainActivity extends ActionBarActivity {

    // 再生の準備   //////////////////////
    MediaPlayer p;  // 再生に必要なファイルの読み込み

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

    /* ******************************************
    * クリック処理 (pops画像)
    ****************************************** */
    public void pops(View v) {
        // 画像の変更
        ((ImageView) findViewById(R.id.pops)).setImageResource(R.drawable.pops2);
        ((ImageView) findViewById(R.id.lock)).setImageResource(R.drawable.lock);
        ((ImageView) findViewById(R.id.jazz)).setImageResource(R.drawable.jazz);

        // 再生中なら停止
        if (p != null && p.isPlaying()) {
            p.stop(); // 停止
            p.release();// メモリの解放
        }

        // mp3の読み込み
        p = MediaPlayer.create(getApplicationContext(), R.raw.pops);
        p.setLooping(true);  // 連続再生設定
        p.start(); // 再生
    }

    /* ******************************************
    * クリック処理 (lock画像)
    ****************************************** */
    public void lock(View v) {
        ((ImageView) findViewById(R.id.pops)).setImageResource(R.drawable.pops);
        ((ImageView) findViewById(R.id.lock)).setImageResource(R.drawable.lock2);
        ((ImageView) findViewById(R.id.jazz)).setImageResource(R.drawable.jazz);

        if (p != null && p.isPlaying()) {
            p.stop();
            p.release();
        }
        p = MediaPlayer.create(getApplicationContext(), R.raw.lock);
        p.setLooping(true);
        p.start();
    }

    /* ******************************************
    * クリック処理 (jazz画像)
    ****************************************** */
    public void jazz(View v) {
        ((ImageView) findViewById(R.id.pops)).setImageResource(R.drawable.pops);
        ((ImageView) findViewById(R.id.lock)).setImageResource(R.drawable.lock);
        ((ImageView) findViewById(R.id.jazz)).setImageResource(R.drawable.jazz2);

        if (p != null && p.isPlaying()) {
            p.stop();
            p.release();
        }

        p = MediaPlayer.create(getApplicationContext(), R.raw.jazz);
        p.setLooping(true);
        p.start();
    }

    /* ******************************************
    * アプリの終了
    ****************************************** */
    @Override
    protected void onDestroy() {
        super.onDestroy();
        // クリア可能か確認
        if (p != null) {
            p.release();// メモリの解放
            p = null; // 最初に読み込んだファイルのクリア
        }
    }
}