.. note::

    Hallo und willkommen in der SunFounder Raspberry Pi & Arduino & ESP32 Enthusiasten-Gemeinschaft auf Facebook! Tauchen Sie tiefer ein in die Welt von Raspberry Pi, Arduino und ESP32 mit anderen Enthusiasten.

    **Warum beitreten?**

    - **Expertenunterstützung**: Lösen Sie Nachverkaufsprobleme und technische Herausforderungen mit Hilfe unserer Gemeinschaft und unseres Teams.
    - **Lernen & Teilen**: Tauschen Sie Tipps und Anleitungen aus, um Ihre Fähigkeiten zu verbessern.
    - **Exklusive Vorschauen**: Erhalten Sie frühzeitigen Zugang zu neuen Produktankündigungen und exklusiven Einblicken.
    - **Spezialrabatte**: Genießen Sie exklusive Rabatte auf unsere neuesten Produkte.
    - **Festliche Aktionen und Gewinnspiele**: Nehmen Sie an Gewinnspielen und Feiertagsaktionen teil.

    👉 Sind Sie bereit, mit uns zu erkunden und zu erschaffen? Klicken Sie auf [|link_sf_facebook|] und treten Sie heute bei!

.. _play_sc:

9. Spiel mit dem @SunFounder Controller
=======================================

In diesem Projekt lernen Sie, wie Sie ein Fernsteuerungsprojekt mit der Sunfounder Controller-App realisieren können. Innerhalb eines lokalen Netzwerks können Sie die Pico W-Schaltung mit Ihrem Smartphone oder Tablet steuern. Diese App ist besonders nützlich, wenn Sie einen einfachen Roboter mit Pico W bauen möchten.

Wir werden die Schiebeleiste in der App verwenden, um den Servowinkel zu steuern, und die Anzeige in der App, um die vom Ultraschallsensor erfasste Entfernung anzuzeigen.

**1. Erforderliche Komponenten**

Für dieses Projekt benötigen wir die folgenden Komponenten.

Es ist definitiv praktisch, ein komplettes Kit zu kaufen, hier ist der Link:

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

    *   - Name
        - ARTIKEL IM KIT
        - LINK
    *   - Kepler-Kit
        - 450+
        - |link_kepler_kit|

Sie können die Teile auch einzeln über die folgenden Links kaufen.

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

    *   - SN
        - KOMPONENTE
        - ANZAHL
        - LINK

    *   - 1
        - :ref:`cpn_pico_w`
        - 1
        - |link_picow_buy|
    *   - 2
        - Micro-USB-Kabel
        - 1
        -
    *   - 3
        - :ref:`cpn_breadboard`
        - 1
        - |link_breadboard_buy|
    *   - 4
        - :ref:`cpn_wire`
        - Mehrere
        - |link_wires_buy|
    *   - 5
        - :ref:`cpn_servo`
        - 1
        - |link_servo_buy|
    *   - 6
        - :ref:`cpn_ultrasonic`
        - 1
        - |link_ultrasonic_buy|
    *   - 7
        - :ref:`cpn_lipo_charger`
        - 1
        -  
    *   - 8
        - 18650 Akku
        - 1
        -  
    *   - 9
        - Batteriehalter
        - 1
        -  

**2. Schaltung aufbauen**

.. warning::

    Stellen Sie sicher, dass Ihr Li-Po-Ladegerät gemäß dem Schaltplan angeschlossen ist. Andernfalls besteht die Gefahr eines Kurzschlusses, der Ihren Akku und die Schaltung beschädigen könnte.

.. image:: img/wiring/9.sc_bb.png
    :width: 800


**3. SunFounder Controller einrichten**

1. Laden Sie die `SunFounder Controller APP <https://docs.sunfounder.com/projects/sf-controller/en/latest/>`_ aus dem **APP Store(iOS)** oder **Google Play(Android)** herunter.

2. Öffnen Sie die App und klicken Sie auf die **+**-Schaltfläche auf der Startseite, um einen Controller zu erstellen.

    .. image:: img/sc-a-2.jpg
        :width: 800

3. Hier wählen wir **Leer** und **Zwei-Stick-Steuerung** aus.

    .. image:: img/sc-a-3.jpg
        :width: 800

4. Nun erhalten wir einen leeren Controller.

    .. image:: img/sc-a-4.jpg
        :width: 800

5. Klicken Sie im Bereich **H** und fügen Sie ein **Schieberegler**-Widget hinzu.

    .. image:: img/sc-a-5.jpg
        :width: 800

6. Klicken Sie auf das Zahnrad des Steuerelements, um das Einstellungsfenster zu öffnen.

    .. image:: img/sc-a-6.png
        :width: 300

7. Setzen Sie Maximum auf 180 und Minimum auf 0, dann klicken Sie auf **Bestätigen**.

    .. image:: img/sc-a-7.jpg
        :width: 800

8. Klicken Sie im Bereich L und fügen Sie ein **Anzeige**-Widget hinzu.

    .. image:: img/sc-a-8.jpg
        :width: 800

9. Klicken Sie auf das Zahnrad der Anzeige, öffnen Sie das Einstellungsfenster, setzen Sie das Maximum auf 100, das Minimum auf 0 und die Einheit auf cm.

    .. image:: img/sc-a-9.jpg
        :width: 800

10. Nach Abschluss der Widget-Einstellungen klicken Sie auf Speichern.

    .. image:: img/sc-a-10.png
        :width: 300



**4. Code ausführen**

.. note:: 
    Falls Ihr Pico W momentan die Anvil-Firmware verwendet, müssen Sie :ref:`install_micropython_on_pico`.

1. Laden Sie ``ws.py`` und ``websocket_helper.py`` aus dem Verzeichnis ``kepler-kit-main/libs`` auf den Raspberry Pi Pico W hoch.

    .. image:: img/9_sc3.png

2. Doppelklicken Sie auf das Skript ``ws.py`` und geben Sie den ``SSID`` und das ``PASSWORT`` Ihres WLANs ein.

    .. image:: img/9_sc1.png

3. Öffnen Sie die Datei ``9_sunfounder_controller.py`` im Verzeichnis ``kepler-kit-main/iot``. Klicken Sie auf die Schaltfläche **Dieses Skript ausführen** oder drücken Sie F5. Nach erfolgreicher Verbindung wird die IP-Adresse des Pico W angezeigt.

    .. image:: img/9_sc2.png

    .. note::
        Falls Sie dieses Skript beim Hochfahren ausführen lassen möchten, können Sie es als ``main.py`` auf dem Raspberry Pi Pico W speichern.

4. Kehren Sie zur SunFounder Controller APP zurück und klicken Sie auf die Schaltfläche **Verbinden**.

    .. image:: img/sc-c-4.jpg
        :width: 300

5. Wenn der PicoW erkannt wird, tippen Sie direkt darauf, um die Verbindung herzustellen.

    .. image:: img/sc-c-5.jpg
        :width: 300

6. Falls keine automatische Suche erfolgt, können Sie auch manuell die IP-Adresse eingeben, um eine Verbindung herzustellen.

    .. image:: img/sc-c-6.png
        :width: 800

7. Wenn Sie den Schieberegler im H-Bereich bewegen, nachdem Sie auf die Schaltfläche **Ausführen** geklickt haben, wird der Servo seinen Winkel einstellen. Die Anzeige im L-Bereich zeigt die Entfernung an, falls sich Ihre Hand innerhalb von 100 cm vor dem Ultraschallsensor befindet.

    .. image:: img/sc-c-8.jpg
        :width: 300

**Wie funktioniert das?**

Die Klasse ``WS_Server`` in der Bibliothek ``ws.py`` implementiert die Kommunikation mit der APP. Im Folgenden ist das Grundgerüst für die Implementierung der wesentlichen Funktionalitäten dargestellt.

.. code-block:: python

    from ws import WS_Server
    import json
    import time

    ws = WS_Server(8765) # init websocket 

    def main():
        ws.start()
        while True:
            status,result=ws.transfer()
            time.sleep_ms(100)

    try:
        main()
    finally:
        ws.stop()

Zuerst müssen wir ein ``WS_Server``-Objekt erstellen.

.. code-block:: python

    ws = WS_Server(8765) 

Starten Sie es.

.. code-block:: python

    ws.start()

Anschließend wird eine ``while True``-Schleife verwendet, um den Datenaustausch zwischen dem Pico W und der SunFounder Controller APP durchzuführen.

.. code-block:: python

    while True:
        #  websocket transfer data
        status,result = ws.transfer()

        # the status of transfer data
        print(status)

        # the data you recv
        print(result)

        # the data you send
        print(ws.send_dict)

        
        time.sleep_ms(100)

``status`` ist ``False``, wenn es fehlschlägt, Daten von der SunFounder Controller APP zu erhalten.

Und ``result`` sind die Daten, die der Pico W von der SunFounder Controller APP abgerufen hat. Drucken Sie diese aus, und es wird etwas Ähnliches wie das Folgende erscheinen. Dies sind die Werte aller Widget-Bereiche.

.. code-block:: 

    {'C': None, 'B': None, 'M': None,,,,, 'A': None, 'R': None}

In diesem Fall drucken wir die Werte des H-Bereichs separat aus und verwenden sie zur Steuerung des Schaltkreises.

.. code-block:: python

        status,result=ws.transfer()
        #print(result)
        if status == True:
            print(result['H'])

Und das ``ws.send_dict`` Wörterbuch enthält die Daten, die der Pico W an die SunFounder Controller APP sendet. Dieses Wörterbuch wird in der ``WS_Server`` Klasse erstellt und versendet, wenn die Methode ``ws.transfer()`` aufgerufen wird.

Die entsprechende Nachricht wird unten dargestellt.


.. code-block:: python

    {'Check': 'SunFounder Controller', 'Name': 'PicoW', 'Type': 'Blank'}

Dies ist eine leere Nachricht. Um sie ins Widget der SunFounder Controller APP zu kopieren, müssen wir den jeweiligen Bereichen im Wörterbuch Werte zuweisen. Beispielsweise weisen wir dem L-Bereich den Wert ``50`` zu.

.. code-block:: python

        ws.send_dict['L'] = 50

Die unten dargestellten Daten sehen dann wie folgt aus:

.. code-block:: python

    {'L': 50, 'Type': 'Blank', 'Name': 'PicoW', 'Check': 'SunFounder Controller'}

Für weitere Informationen zur Verwendung des SunFounder Controllers, siehe bitte `SunFounder Controller APP <https://docs.sunfounder.com/projects/sf-controller/en/latest/>`_.
