.. note::

    こんにちは、SunFounderのRaspberry Pi & Arduino & ESP32愛好家コミュニティへようこそ！Facebook上でRaspberry Pi、Arduino、ESP32についてもっと深く掘り下げ、他の愛好家と交流しましょう。

    **参加する理由は？**

    - **エキスパートサポート**：コミュニティやチームの助けを借りて、販売後の問題や技術的な課題を解決します。
    - **学び＆共有**：ヒントやチュートリアルを交換してスキルを向上させましょう。
    - **独占的なプレビュー**：新製品の発表や先行プレビューに早期アクセスしましょう。
    - **特別割引**：最新製品の独占割引をお楽しみください。
    - **祭りのプロモーションとギフト**：ギフトや祝日のプロモーションに参加しましょう。

    👉 私たちと一緒に探索し、創造する準備はできていますか？[|link_sf_facebook|]をクリックして今すぐ参加しましょう！

.. _sh_eat_apple:

2.14 GAME - リンゴを食べる
==============================

このプロジェクトでは、ボタンを使ってビートルがリンゴを食べるゲームをします。

緑の旗をクリックしたら、ボタンを押してビートルが回転し、再びボタンを押すとビートルがその角度で前進を停止します。ビートルの角度を制御して、地図上の黒線に触れずにリンゴを食べるまで前進させる必要があります。黒線に触れたらゲームオーバーです。

.. image:: img/14_apple.png

必要な部品
---------------------

このプロジェクトには、以下のコンポーネントが必要です。

全セットを購入するのは非常に便利です。こちらがリンクです：

.. list-table::
    :widths: 20 20 20
    :header-rows: 1

    *   - 名前
        - このキットのアイテム
        - リンク
    *   - ESP32 Starter Kit
        - 320+
        - |link_esp32_starter_kit|

以下のリンクから別々に購入することもできます。

.. list-table::
    :widths: 30 20
    :header-rows: 1

    *   - コンポーネントの紹介
        - 購入リンク

    *   - :ref:`cpn_esp32_wroom_32e`
        - |link_esp32_wroom_32e_buy|
    *   - :ref:`cpn_esp32_camera_extension`
        - |link_esp32_extension_board|
    *   - :ref:`cpn_breadboard`
        - |link_breadboard_buy|
    *   - :ref:`cpn_wires`
        - |link_wires_buy|
    *   - :ref:`cpn_resistor`
        - |link_resistor_buy|
    *   - :ref:`cpn_button`
        - |link_button_buy|

回路の構築
-----------------------

ボタンは4ピンデバイスで、ボタンが押されると、ピン1がピン2に、ピン3がピン4に接続され、4ピンが接続されて回路が閉じます。

.. image:: img/5_buttonc.png

次の図に従って回路を組み立てます。

* ボタン左側のピンの一つをピン14に接続し、ピン14はプルダウン抵抗と0.1uF (104) のコンデンサ（ジッタを消去し、ボタンが動作時に安定したレベルを出力するため）に接続されます。
* 抵抗とコンデンサの他端をGNDに接続し、ボタン右側のピンを5Vに接続します。

.. image:: img/circuit/6_doorbel_bb.png

プログラミング
------------------
達成したい効果は、ボタンを使って **Beetle** スプライトの方向を制御し、 **Maze** の背景の黒線に触れることなく前進してリンゴを食べ、食べると背景が切り替わることです。

今、関連する背景とスプライトを追加しましょう。


**1. 背景とスプライトの追加**

**Choose a backdrop** ボタンから **Maze** の背景を追加します。

.. image:: img/14_backdrop.png

デフォルトのスプライトを削除し、 **Beetle** スプライトを選択します。

.. image:: img/14_sprite.png

**Beetle** スプライトを **Maze** の背景の入口に置き、この時点でのx,y座標値を覚えておき、スプライトのサイズを40%に調整します。

.. image:: img/14_sprite1.png

**2. 背景の描画**

次に、WIN!と表示される背景を描くだけの簡単な作業です。

まず背景サムネイルをクリックして **Backdrops** ページに移動し、空白のbackdrop1をクリックします。

.. image:: img/14_paint_back.png
    :width: 800

今から描き始めますが、以下の写真を参考に描くことも、勝利を表現していれば自分で背景を描いても構いません。

* **Circle** ツールを使用して、赤色でアウトラインのない楕円を描きます。
* その後、 **Text** ツールを使って「WIN!」という文字を書き、文字色を黒に設定し、文字のサイズと位置を調整します。
* この背景の名前を **Win** にします。

.. image:: img/14_win.png

**3. 背景のスクリプト化**

ゲームがスタートするたびに、背景を **Maze** に切り替える必要があります。

.. image:: img/14_switchback.png

**4. スプライトビートルのスクリプト作成**

次に、ボタンの制御下で **Beetle** スプライトが前に進み、方向を変えることができるスクリプトを書きます。ワークフローは以下の通りです。

* 緑の旗がクリックされたら、 **Beetle** の角度を90に設定し、位置を(-134, -134)に設定します。または、自分で置いた位置の座標値に置き換えてください。変数 **flag** を作成し、初期値を-1に設定します。

.. image:: img/14_bee1.png

次に、[forever]ブロック内で、さまざまな可能性のあるシナリオを判断するために4つの[if]ブロックを使用します。

* ボタンが1（押された）の場合、[`mod <https://en.scratch-wiki.info/wiki/Boolean_Block>`_]ブロックを使用して変数 **flag** の値を0と1（この押しで0、次の押しで1）との間で切り替えます。

.. image:: img/14_bee2.png

* flag=0（このボタン押し）の場合、 **Beetle** スプライトが時計回りに回転させます。その後、flagが1に等しいか（再びボタンが押されたか）を判断し、等しい場合は **Beetle** スプライトが前に進みます。それ以外の場合は、引き続き時計回りに回転します。

.. image:: img/14_bee3.png

* ビートルスプライトが黒（ **Maze** の背景にある黒い線）に触れた場合、ゲームは終了し、スクリプトの実行が停止します。

.. note::
    
    [Touch color]ブロックの色エリアをクリックし、その後スポイトツールを選択してステージ上の黒い線の色を取ります。任意の黒を選んだ場合、この[Touch color]ブロックは機能しません。


.. image:: img/14_bee5.png

* ビートルが赤に触れる場合（リンゴの赤色もストローツールで取ります）、背景を **Win** に切り替え、ゲームが成功し、スクリプトの実行が停止します。


.. image:: img/14_bee4.png