★★★☆☆ – ページ 2 – ハコニワデザイン

Android プログラミング【 AlertDialog 】~ 「戻る」ボタンで表示 ~

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

プログラミング未経験者対象の【 Androidアプリ作成動画】です。

この動画は「AlertDialog（アラートダイアログ）の利用」を行ってます。
戻るボタンを押したときにダイアログを表示し、YESを選択するとアプリを終了します。

プロジェクト名

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

Application name MyDialog
Company Domain test.com
Package name com.test.mydialog

alertdialog プロジェクト名

MainActivity.java（完成）

package com.test.mydialog;

import android.content.DialogInterface;
import android.os.Bundle;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.view.KeyEvent;

public class MainActivity extends AppCompatActivity {

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

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        switch (keyCode){
            case KeyEvent.KEYCODE_BACK:
                new AlertDialog.Builder(this)
                        .setTitle("終了確認")
                        .setMessage("アプリを終了しますか？")
                        .setNegativeButton("NO", null)
                        .setPositiveButton("YES",

                                new DialogInterface.OnClickListener() {
                                    @Override
                                    public void onClick(DialogInterface dialog, int which) {
                                        finish();
                                    }
                                }

                        )
                        .show();
        }
        return super.onKeyDown(keyCode, event);
    }
}

Android プログラミング【 AlertDialog 】 ~ ダイアログ利用 ~

2016年12月5日2016年12月6日たんたむ

プロジェクト名

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

Application name MyDialog
Company Domain test.com
Package name com.test.mydialog

alertdialog プロジェクト名

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.mydialog.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!" />
</RelativeLayout>

MainActivity.java（完成）

package com.test.mydialog;

import android.content.DialogInterface;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

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

        new AlertDialog.Builder(this)
                .setTitle("背景色")
                .setMessage("背景色を変更しますか？")
                .setPositiveButton("YES",
                        new DialogInterface.OnClickListener() {
                            @Override
                            public void onClick(DialogInterface dialog, int which) {
                                findViewById(R.id.activity_main).setBackgroundColor(Color.BLUE);
                            }
                        }
                )
                .setNegativeButton("NO",
                        new DialogInterface.OnClickListener() {
                            @Override
                            public void onClick(DialogInterface dialog, int which) {
                                Toast.makeText(MainActivity.this,"了解しました！",Toast.LENGTH_SHORT).show();
                            }
                        }
                )
                .show();

    }
}

Android プログラミング【 AlertDialog 】 ~ ダイアログ表示 ~

2016年12月5日2016年12月6日たんたむ

プロジェクト名

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

Application name MyDialog
Company Domain test.com
Package name com.test.mydialog

MainActivity.java（完成）

package com.test.mydialog;

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

public class MainActivity extends AppCompatActivity {

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

        new AlertDialog.Builder(this)
                .setTitle("ああああ")
                .setMessage("いいいいいいいいいいい")
                .setPositiveButton("YES",null)
                .setNegativeButton("NO",null)
                .show();
        
    }
}

Android プログラミング【 Preference 】 ~ 保存型カウンター ~

2016年11月26日2016年12月1日たんたむ

アプリ開発初心者用の学習動画です。

この動画はpreferences（プリファレンス・データの保存）を使ったカウンターの作成動画です。

前回と前々回を組み合わせたアプリになります。
・【 Preference 】 ~ データ保存 ~
・【タッチイベント】 ~ カウンターの作成 ~

プロジェクト名

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

Application name MyCount
Company Domain test.com
Package name com.test.mycount

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"
    android:gravity="center"
    tools:context="com.test.mycount.MainActivity">

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

</RelativeLayout>

MainActivity.java（完成）

package com.test.mycount;

import android.content.SharedPreferences;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    // カウントデータ
    int count = 0;

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

        // データの読込
        SharedPreferences preferences = getSharedPreferences("game_data",MODE_PRIVATE);
        count = preferences.getInt("count" , 0);
        ((TextView)findViewById(R.id.count)).setText("" + count);
    }


    ///////////////////////////////////////////////////
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()){
            case MotionEvent.ACTION_DOWN:
                // カウントの加算
                count++;
                ((TextView)findViewById(R.id.count)).setText("" + count);
        }
        return super.onTouchEvent(event);
    }


    ///////////////////////////////////////////////////
    @Override
    protected void onPause() {
        super.onPause();

        // データの保存
        SharedPreferences preferences = getSharedPreferences("game_data",MODE_PRIVATE);
        SharedPreferences.Editor editor = preferences.edit();
        editor.putInt("count",count);
        editor.commit();
    }
}

Android プログラミング【タッチイベント】 ~ 画面タッチで画像変更 ~

2016年6月30日2016年12月19日たんたむ

アプリ開発初心者用の学習動画です。

今回は画面タッチ時の処理を勉強する動画で、前回の「画面タッチで文字変更」の復習動画です。

※ 前回だけではよくわからなかった人用の復習動画です。

画像素材

＊注意＊
・画像をご自身で要するにはファイル名やファイルサイズ、拡張子に注意する必要があります。
・ファイル名は半角小文字の英数（a～z 0～9）とアンダーバー( _ )のみで、最初の１文字目は半角英字( a ～ z)のみです。
・慣れてない方はサンプル画像の使用をオススメします。

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"
    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.mytouch.MainActivity">

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

</RelativeLayout>

MainActivity.java（完成）


package com.test.mytouch;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {

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

    // タッチイベント（画面タッチを感知する）
    @Override
    public boolean onTouchEvent(MotionEvent event) {

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

        return super.onTouchEvent(event);
    }
}

Android プログラミング【タッチイベント】 ~ 画面タッチで文字変更 ~

2016年4月30日2016年11月24日たんたむ

アプリ開発初心者用の学習動画です。

画面タッチ時の処理を勉強する動画です。
ここでは、「画面をタッチすると文字が変わる」をサンプルに取り上げたいと思います。

プロジェクト名

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

Application name MyTouch
Company Domain test.com
Package name com.test.mytouch

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"
    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.mytouch.MainActivity">

    <TextView
        android:textSize="40sp"
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="タッチしてね！" />
</RelativeLayout>

MainActivity.java（完成）



package com.test.mytouch;

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

public class MainActivity extends AppCompatActivity {

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

    // タッチイベント（画面タッチを感知する）
    @Override
    public boolean onTouchEvent(MotionEvent event) {

        // 文字の変更
        ((TextView)findViewById(R.id.text)).setText("タッチしたよ！！");

        return super.onTouchEvent(event);
    }
}

Android プログラミング【アクティビティ⑥ 】 ~ ゲームの画面移行 ~

2016年3月3日2016年3月5日たんたむ

擬似的なゲームを想定し、画面移行を学習する動画です。

アクティビティ 1~5

この動画は以前UPしたアクティビティの続編です。以下を先に御覧ください。

画面移行

Activity 画面移行

プロジェクト名

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

Application name RpgGame
Company Domain test.com
Package name com.test.rpggame

Activity 新規プロジェクト

使用素材

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

ファイル構造

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="fitXY"
        android:src="@drawable/main" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:onClick="onButton1"
        android:text="スタート"
        android:textSize="30sp" />
</RelativeLayout>

activity_play.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.PlayActivity">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:src="@drawable/play" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:onClick="onButton2"
        android:text="アタック"
        android:textSize="30sp" />

</RelativeLayout>

activity_over.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.OverActivity">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:src="@drawable/over" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:onClick="onButton3"
        android:text="タイトルに戻る"
        android:textSize="30sp" />

</RelativeLayout>

MainActivity.java

package com.test.rpggame;

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, PlayActivity.class);
        startActivity(intent);
    }
}

PlayActivity.java

package com.test.rpggame;

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

public class PlayActivity extends AppCompatActivity {

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

    public void onButton2(View v) {
        Intent intent = new Intent(this, OverActivity.class);
        startActivity(intent);
        finish();
    }
}

OverActivity.java

package com.test.rpggame;

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

public class OverActivity extends AppCompatActivity {

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

    public void onButton3( View v){
        finish();
    }
}

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図解

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);                          //  画面を開く
    }
}