Android – ページ 5 – ハコニワデザイン

Android プログラミング【アニメーション ① 】 ~上下移動~

2016年1月31日2016年2月1日たんたむ

XMLでのシンプルなアニメーションです。
「出来る限り簡単、コピペで出来る」を目指した動画です。

動画リスト

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

使用素材

プロジェクト名

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

Application name Anim
Company Domain test.com
Package name com.test.anim

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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.test.anim.MainActivity">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="centerCrop"
        android:src="@drawable/back" />

    <ImageView
        android:id="@+id/monster"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/monster" />

</RelativeLayout>

ファイル構成

アニメーション専用のフォルダとファイルを作成します。
ファイルやフォルダの階層と名前を確認してください。

a1.xml

上下移動を繰り返します。


<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
    android:duration="1000"
    android:fromYDelta="0"
    android:toYDelta="10%"
    android:repeatMode="reverse"
    android:repeatCount="-1"
    />
</set>

ポイント

アニメーションさせたいタイミングに以下を記載します。

findViewById(R.id.monster).startAnimation(AnimationUtils.loadAnimation(this, R.anim.a1));

MainActivity.java

アプリケーション起動時にアニメーションをスタートしています。

package com.test.anim;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.animation.AnimationUtils;

public class MainActivity extends AppCompatActivity {

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

        findViewById(R.id.monster).startAnimation(AnimationUtils.loadAnimation(this, R.anim.a1));

    }

}

Java図解

15分で作る？【４択クイズ】～小さい順にタップ～

2016年1月19日2016年1月24日たんたむ

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

難易度

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

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

配列
IF
キャスト
ジェネリクス

動画リスト

プロジェクト名

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

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

activity_main.xml（①画面作成編・完成）

<?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>

MainActivity.java（ ② ランダム出題編）

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));
    }
    
}

MainActivity.java（ ③ 正解判定編）

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+"問正解！！");  // 正解表示
            
        }
    }
}

MainActivity.java（ ④ ゲームオーバー）

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);
        }
    }
}

MainActivity.java（ ⑤ 完成編）

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分で作る？【動画の再生】～選択再生～

2016年1月19日2016年1月19日たんたむ

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

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

難易度：★★★★☆

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

画面構成

使用素材

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

画像素材

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

動画素材

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

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

サンプル動画【ひよこ】

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

プロジェクト名

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

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

ファイル構成

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

activity_main.xml（完成）

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

<?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>

MainActivity.java（完成）

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

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);
    }

}

activity_main2.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: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>

Main2Activity.java（完成）

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));
    }
}

AndroidManifest.xml（完成）

<?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>

Android プログラミング【アクティビティ⑤ 】 ~ 画面を閉じる ~

2016年1月9日2016年1月12日たんたむ

画面を閉じる（アクティビティの終了）を学習します。
画面を閉じるは、最短１行の入力で可能です。

動画リスト

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

ポイント

ボタンの追加

「閉じるボタン」を追加します。
編集するXMLのファイル名にご注意ください。

activity_gallery.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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#88ffff"
    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.activity.Gallery">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="ギャラリー"
        android:textSize="30sp" />

    <Button
        android:onClick="onClose"
        android:layout_centerInParent="true"
        android:textSize="30sp"
        android:text="閉じる"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    
</RelativeLayout>

プログラムの追加

プログラム（動的な命令）を追加します。
編集するJavaのファイル名にご注意ください。

Gallery.java


package com.test.activity;

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

public class Gallery extends AppCompatActivity {

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

    // クリック処理
    public void onClose( View v){
        finish();       // 画面を閉じる（アクティビティの終了）
    }
}

Android プログラミング【アクティビティ④ 】 ~ 画面の切替 ~

2016年1月8日2016年1月25日たんたむ

アプリ開発に必須のアクティビティを学習します。
今回は、前回作成した画面を表示する方法を学習します。

動画リスト

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

MainActivity.java (完成)


package com.test.activity;

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 onButton1( View v){
        Intent intent = new Intent(this,Setting.class); // 画面指定
        startActivity(intent);                          //  画面を開く
    }

    // クリック処理
    public void onButton2( View v){
        Intent intent = new Intent(this,Gallery.class); // 画面指定
        startActivity(intent);                          //  画面を開く
    }
}

ポイント

Android プログラミング【アクティビティ③ 】 ~ 画面の編集 ~

2016年1月8日2016年1月12日たんたむ

前回作成した画面を編集します。
編集するファイルを、間違わなかったら問題ないと思います。

動画リスト

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

activity_main.xml

メインのタイトル画面です。
タイトルと画面切り替えのためのボタンが２つあります。


<?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="com.test.activity.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="タイトル画面"
        android:textSize="30sp" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="onButton1"
        android:text="設定画面"
        android:textSize="30sp" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="onButton2"
        android:text="ギャラリー"
        android:textSize="30sp" />
</LinearLayout>

activity_setting.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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#ffaaff"
    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.activity.Setting">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="設定画面"
        android:textSize="30sp" />
</RelativeLayout>

activity_gallery.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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#88ffff"
    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.activity.Gallery">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="ギャラリー"
        android:textSize="30sp" />

</RelativeLayout>

Android プログラミング【アクティビティ② 】 ~ 画面の作成 ~

2016年1月7日2016年1月12日たんたむ

アプリ開発に必須のアクティビティを学習します。
今回は３つの画面を作り、作成されるファイルを確認します。

動画リスト

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

完成の確認

作成の流れ

画面の作成（アクティヴィティの作成）は、細かい詳細を省くと超カンタンです。
以下の流れで作成できますので、確認してください。

Android プログラミング【アクティビティ① 】 ~ アクティビティとは ~

2016年1月7日2016年1月12日たんたむ

アプリ開発に必須のアクティビティを学習します。
アクティビティを簡単に言うと「画面」です。

かなり重要な項目ですが、挫折ポイントでもある難問です。
焦らずにまずは「慣れ」を目指してください。

動画リスト

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

解説

Android Studio 入門【画面分割④ 】~複数レイアウト~

2015年12月28日2016年1月5日たんたむ

画面分割の①~③を組み合わせて、複雑なレイアウトを目指します。
RPG画面をモデルにしていますが、クイズ画面、メニュー画面など幅広く応用できます。

動画リスト

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

縦横画面対応

画面が縦でも横でもそれなりに見える作りを目指しました。

Designタブ

レイアウトと画像の順番、配置にご注意してください。

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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.test.rpggame.MainActivity">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="centerCrop"
        android:src="@drawable/back" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="2"
            android:src="@drawable/m0" />


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:orientation="horizontal">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:scaleType="fitEnd"
                android:src="@drawable/p0" />

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:scaleType="fitEnd"
                android:src="@drawable/p1" />

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:scaleType="fitEnd"
                android:src="@drawable/p2" />

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:scaleType="fitEnd"
                android:src="@drawable/p3" />
        </LinearLayout>
    </LinearLayout>

</RelativeLayout>

Android Studio 入門【画面分割③ 】~下揃え~

2015年12月28日2016年1月5日たんたむ

画面下部にキャラクター（画像）を並べるレイアウトです。
もちろん、アイコンやメニューを並べることも可能です。

動画リスト

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

縦横画面対応

画面が縦でも横でもそれなりに見える作りを目指しました。

Designタブ

レイアウトと画像の順番、配置にご注意してください。

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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.test.rpggame.MainActivity">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="centerCrop"
        android:src="@drawable/back" />

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageView
            android:scaleType="fitEnd"
            android:layout_weight="1"
            android:src="@drawable/p0"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
             />

        <ImageView
            android:scaleType="fitEnd"
            android:layout_weight="1"
            android:src="@drawable/p1"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
        <ImageView
            android:scaleType="fitEnd"
            android:layout_weight="1"
            android:src="@drawable/p2"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
        <ImageView
            android:scaleType="fitEnd"
            android:layout_weight="1"
            android:src="@drawable/p3"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </LinearLayout>


</RelativeLayout>

動画リスト

使用素材

プロジェクト名

activity_main.xml

ファイル構成

a1.xml

ポイント

MainActivity.java

Java図解

難易度

動画リスト

プロジェクト名

activity_main.xml（①画面作成編・完成）

MainActivity.java（ ② ランダム出題編 ）

MainActivity.java（ ③ 正解判定編 ）

MainActivity.java（ ④ ゲームオーバー ）

MainActivity.java（ ⑤ 完成編 ）

難易度：★★★★☆

画面構成

使用素材

画像素材

動画素材

プロジェクト名

ファイル構成

activity_main.xml（完成）

MainActivity.java（完成）

activity_main2.xml（完成）

Main2Activity.java（完成）

AndroidManifest.xml（完成）

動画リスト

ポイント

ボタンの追加

activity_gallery.xml

プログラムの追加

Gallery.java

動画リスト

MainActivity.java (完成)

ポイント

動画リスト

activity_main.xml

activity_setting.xml

activity_gallery.xml

動画リスト

完成の確認

作成の流れ

動画リスト

解説

動画リスト

縦横画面対応

Designタブ

activity_main.xml

動画リスト

縦横画面対応

Designタブ

activity_main.xml

XML図解

MainActivity.java（ ② ランダム出題編）

MainActivity.java（ ③ 正解判定編）

MainActivity.java（ ④ ゲームオーバー）

MainActivity.java（ ⑤ 完成編）