Spisu treści:

ColorPicker: 10 kroków
ColorPicker: 10 kroków

Wideo: ColorPicker: 10 kroków

Wideo: ColorPicker: 10 kroków
Wideo: Figma Tutorial: Color Picker 2024, Listopad
Anonim
Narzędzie do wybierania kolorów
Narzędzie do wybierania kolorów

Celem tego projektu jest pomiar kolorów i przełożenie ich na inne systemy kolorystyczne. Używając tylko wartości RGB podanych przez czujnik, możesz przetłumaczyć na HSL, CYMK, HEX, a także najbliższy kod RAL (standard używany do malowania). Ten projekt wymaga podstawowej znajomości Pythona, MySQL, Linuxa i Javascript.

Jeśli znasz również framework Flask i SocketIO, kod tego projektu powinien być dla Ciebie łatwy do zrozumienia.

Ten projekt może być używany przez malarzy, projektantów wnętrz lub po prostu przez każdego, kto potrzebuje zmierzyć kolory.

Ten projekt nie jest tak drogi i kosztuje około _ euro, bez wysyłki.

Kieszonkowe dzieci

Możemy podzielić tę sekcję na dwie części:

  • Sprzęt komputerowy
  • Oprogramowanie

Sprzęt komputerowy

Używamy następujących komponentów

  • HC04: Czujnik odległości, jak daleko mierzymy od obiektu
  • Wyświetlacz LCD 2x16
  • Moduł LCD I2C (HW061)
  • TCS34725 Moduł czujnika koloru (Adafruit)
  • Biała dioda LED
  • Raspberry Pi 3 (każdy Raspberry Pi powinien działać)
  • Rezystor 5x 1k Ohm
  • 1x rezystor 220 lub 330 Ohm
  • Karta SD 16 GB (14,4 GB)

Oprogramowanie

  • Python IDE, taki jak Visual Code lub Pycharm (tutaj użyto Pycharm)
  • Środowisko pracy MySQL
  • Szpachlówka (Pobierz Szpachlówkę)
  • Rufus lub jakikolwiek inny program do zapisu kart SD (Pobierz Rufus)

cennik

Ten projekt jest dość tani, jeśli masz już Rapsberry Pi.

  • HC04: Od około 2,5 euro (Chiny) i do 6 euro za więcej lokalnych sklepów.
  • LCD: około 6-8 euro.
  • Moduł I2C: tak tani poniżej 1 euro (Chiny), ale do 4 euro w przypadku większej liczby lokalnych sklepów.
  • TCS34725: około 9-12 euro. Najdroższa część (bez RPi)
  • Biała dioda LED: kupowane hurtowo, 20 diod LED już za 1 €
  • Raspberry Pi: w zależności od wersji około 40 euro
  • Rezystory: 0,10 € za jeden rezystor
  • Karta SD: około 8 €

Zasilacz do Raspberry Pi nie jest wliczony w cenę, ponieważ ten adapter jest dość powszechny.

Całkowity przedział cenowy: około 70 €, jeśli uwzględnisz Raspberry Pi i obudowę projektu.

Do budowy obudowy użyłem lekkiego, cienkiego drewna. Odzyskałem to drewno z mebli. Materiał na etui zależy od Ciebie.

Krok 1: Krok 1: Instalacja systemu operacyjnego RPi, konfiguracja SSH i dostępu do Internetu

Krok 1: Instalacja systemu operacyjnego RPi, konfiguracja SSH i dostępu do Internetu
Krok 1: Instalacja systemu operacyjnego RPi, konfiguracja SSH i dostępu do Internetu
Krok 1: Instalacja systemu operacyjnego RPi, konfiguracja SSH i dostępu do Internetu
Krok 1: Instalacja systemu operacyjnego RPi, konfiguracja SSH i dostępu do Internetu
Krok 1: Instalacja systemu operacyjnego RPi, konfiguracja SSH i dostępu do Internetu
Krok 1: Instalacja systemu operacyjnego RPi, konfiguracja SSH i dostępu do Internetu
Krok 1: Instalacja systemu operacyjnego RPi, konfiguracja SSH i dostępu do Internetu
Krok 1: Instalacja systemu operacyjnego RPi, konfiguracja SSH i dostępu do Internetu

Krok 1.1: Instalacja obrazu

Pobierz obraz z oficjalnej strony Raspberry Pi. Tak naprawdę nie ma znaczenia, jaki obraz zainstalujesz. W przypadku tego projektu GUI nie jest potrzebne, ponieważ połączymy się tylko za pomocą SSH.

Zapisz obraz na (pustej) karcie SD (wszystkie pliki na karcie zostaną usunięte).

Aby zapisać wszystko na karcie SD, użyjemy narzędzia o nazwie „Rufus”. Po pobraniu obrazu otwórz Rufusa i wybierz plik obrazu. Wybierz dysk docelowy i zapisz obraz na dysku. To może chwilę potrwać.

> Rufuś

Krok 1.2: Instalacja SSH

Następnym krokiem jest utworzenie połączenia z kartą SD. Aby to zrobić, musimy włączyć SSH.

Aby to zrobić bez korzystania z monitora, otwórz eksplorator plików i otwórz partycję rozruchową karty SD. Utwórz pusty plik o nazwie „ssh”, bez rozszerzenia pliku.

Otwórz także „cmdline.txt”

Dodaj „169.254.10.1” na końcu pliku i zapisz go.

Odmontuj kartę SD i włóż ją do Raspberry Pi.

Teraz możemy podłączyć Raspberry Pi do źródła zasilania i uruchomić i połączyć się za pomocą SSH.

Aby połączyć się za pomocą SSH, używamy programu „Putty”. Zanim to zrobisz, połącz RPi i komputer za pomocą kabla Ethernet. Otwórz Putty i przejdź do zakładki SSH i wpisz ten adres IP: 169.254.10.1. Kliknij „Połącz”, a zostaniesz połączony.

> Szpachlówka

Domyślny login używany przez Raspberry Pi to „pi” jako nazwa użytkownika i „raspberry” jako hasło.

Krok 1.3: Połączenie bezprzewodowe

Twoje Raspberry Pi jest teraz włączone.

Chcemy również połączyć się z RPi za pomocą Wifi, w ten sposób nie potrzebujemy już kabla Ethernet.

Wykonaj następujący wiersz:

'sudo nano /etc/wpa_supplicant/wpa_supplicant.conf'

Spowoduje to otwarcie edytora tekstu „nano” z podwyższonymi uprawnieniami.

Dodaj następujące wiersze w pliku:

sieć={

ssid="SSID"

psk="Hasło"

}

Zastąp „SSID” identyfikatorem SSID swojej sieci Wi-Fi

Zastąp „Hasło” swoim hasłem.

Następnie wykonaj Ctrl+X i wybierz opcję „tak”. Plik zostanie teraz zapisany.

Teraz musimy ponownie uruchomić usługę sieciową

Wykonaj następujące polecenia:

  • „sudo-i”
  • 'sudo systemctl uruchom ponownie sieć'

Możesz przetestować swoje połączenie internetowe za pomocą polecenia wget.

Przykład: „wget google.com”

> Wget polecenie

Krok 2: Krok 2: Instalacja oprogramowania na RPi

Do tego projektu musimy zainstalować kilka bibliotek.

  • Mariadb: baza danych MySQL (sudo apt-get install mariadb-server)
  • Biblioteka Adafruit dla czujnika koloru: Pomiar kolorów (pip3 zainstaluj adafruit-circuitpython-tcs34725)
  • PHPmyAdmin: ('sudo apt install phpmyadmin', wybierz serwer WWW Apache)

Zainstaluj również następujące biblioteki pip:

  • flask_socketio
  • kolba
  • flask_cors
  • deska
  • zajęty
  • netifaces

Krok 3: Krok 3: Łączenie się z bazą danych MySQL, tworzenie bazy danych

Krok 3: Łączenie się z bazą danych MySQL, tworzenie bazy danych
Krok 3: Łączenie się z bazą danych MySQL, tworzenie bazy danych
Krok 3: Łączenie się z bazą danych MySQL, tworzenie bazy danych
Krok 3: Łączenie się z bazą danych MySQL, tworzenie bazy danych
Krok 3: Łączenie się z bazą danych MySQL, tworzenie bazy danych
Krok 3: Łączenie się z bazą danych MySQL, tworzenie bazy danych

Następnym krokiem jest połączenie się z bazą danych MySQL za pomocą środowiska pracy MySQL.

> IP

Wykonaj polecenie „ip a”, jak pokazano na powyższym obrazku (kliknij link)

W większości sytuacji zostaną wyświetlone 3 wpisy. Potrzebujemy wpisu „wlan0”. Skopiuj adres IP obok „inet” lub w tym przykładzie „192.168.1.44”

.>> Utwórz nowe połączenie

Jak pokazano na powyższym obrazku, utwórz nowe połączenie z następującymi parametrami (obraz poniżej dla parametrów)

> Parametry połączenia

Kliknij dwukrotnie nowo utworzone połączenie, aby się połączyć.

Jeśli pojawi się monit, kliknij „Tak”.

To wciąż pusta baza danych, więc dodajmy kilka tabel.

Najpierw utwórz schemat, w tym celu po lewej stronie 'kliknij prawym' i wybierz 'utwórz schemat'.

Nadaj schematowi nazwę i potwierdź.

Teraz musimy dodać tabele. Rozwiń schemat i kliknij prawym przyciskiem myszy tabele.

Utwórz następujące schematy:

> Tabela 1: Kolory RAL

> Tabela 2: Typy czujników

> Tabela 3: Pomiary (na zdjęciu „metingen”, niderlandzki dla pomiarów)

> Tabela 4: Dane_strony || Tabela 4 dół

MySQL jest relacyjnym systemem bazodanowym, co oznacza, że możemy tworzyć relacje między tabelami.

Pierwsza relacja, którą musimy stworzyć, to między „typ_czujnika” a „pomiarami”.

Jak pokazano na rysunku, połącz dwa klucze.

> Edytuj tabelę i klawisze linków

Nie zapomnij zapisać zmian, klikając „Zastosuj” w dolnym rogu.

Edytuj także tabelę „website_data” i połącz „MetingID”.

Teraz skończyliśmy z tworzeniem tabel i tworzeniem relacji.

Dodawanie danych:

Tabela RALcolors jest tabelą stałą, w której wartości nigdy się nie zmienią. Możemy dodać te wartości

bardzo łatwo.

> Pobierz plik Excel

Pobierz plik Excel powyżej i zaznacz wszystkie dane i „skopiuj”. Zrób jak na obrazku

> Pokaż tabelę

„kliknij prawym przyciskiem myszy” na tabelę i wybierz „Wklej wiersze”. „kliknij” „zastosuj” w dolnym rogu, aby dodać dane.

Teraz wszystkie kolory RAL są zapisywane w bazie danych.

Musimy tylko teraz dodać sensor_type do bazy danych.

> Dane typu czujnika

Uwaga: opis czujnika znajduje się w języku „holenderskim”

Krok 4: Krok 4: Filezilla

Krok 4: Filezilla
Krok 4: Filezilla

Aby łatwo połączyć się z Raspberry Pi i przesyłać pliki, możemy skorzystać z Filezilli.

> Pobierz Filezilla

Zapisz w szczegółach połączenia i połącz. Po prawej stronie możesz teraz przesyłać pliki, przeciągając je.

> Źródło Github

Pobierz pliki z powyższego źródła github.

Krok 5: Krok 5: Tworzenie strony internetowej

Krok 5: Tworzenie strony internetowej
Krok 5: Tworzenie strony internetowej
Krok 5: Tworzenie strony internetowej
Krok 5: Tworzenie strony internetowej

Do hostingu strony używamy PHPmyAdmin i Apache2.

Serwer WWW na Raspberry Pi używa katalogu „/var/www/html” jako root.

Jeśli umieścisz tam swoje pliki, będą one hostowane na IP Raspberry Pi. (IP = patrz 'ip a')

Możesz pobrać wymagane pliki z mojego repozytorium github (poprzedni krok)

W „/var/www/html/” wklej wszystkie pliki z folderu „Frontend”.

> /var/www/html/

Krok 6: Krok 6: Tworzenie zaplecza (kolby)

Backend serwisu oparty jest na Flasku.

Wszystkie pliki można znaleźć w repozytorium github.

Skopiuj wszystkie pliki do dowolnego katalogu na Raspberry Pi.

Na przykład '/home/pi/colorpicker.

Aby utworzyć katalog, przejdź do katalogu docelowego za pomocą 'cd', a następnie wykonaj 'mkdir'.

To wszystko na teraz. Kod zostanie wyjaśniony w kolejnych krokach.

Krok 7: Krok 7: Sprzęt

> Pobierz schemat

Utwórz schemat jak pokazano w powyższym dokumencie.

UWAGA: Dodaj również jedną białą diodę LED z jednym rezystorem (220 lub 330 omów).

Wyjaśnienie sprzętu

HC04

Czujnik HC04 emituje fale, które odbijają się i są ponownie odbierane przez czujnik.

Obliczając deltę czasu między nadawaniem a odbiorem, możemy obliczyć odległość.

Odległość = ((Timestamp_recieve - Timestamp_emit) / prędkość dźwięku) /2

Dzielimy przez dwa, ponieważ fala odbija się, co oznacza, że dwukrotnie pokonuje odległość.

LCD

Używamy wyświetlacza LCD do wyświetlania RGB i HEX, a także IP podczas uruchamiania programu.

Do tego LCD kupiłem moduł I2C. Teraz potrzebujemy tylko 4 przewodów. SDA, SCL, GND, VCC

Aby korzystać z tego wyświetlacza LCD, napisałem klasę Pythona, aby była łatwiejsza w użyciu.

TCS34725

Ten czujnik pozwala mierzyć kolory. Używamy biblioteki do pomiaru wartości RGB.

Krok 8: Krok 8: Wyjaśnienie kodu

Krok 8: Wyjaśnienie kodu
Krok 8: Wyjaśnienie kodu
Krok 8: Wyjaśnienie kodu
Krok 8: Wyjaśnienie kodu
Krok 8: Wyjaśnienie kodu
Krok 8: Wyjaśnienie kodu
Krok 8: Wyjaśnienie kodu
Krok 8: Wyjaśnienie kodu

Frontend

Frontend składa się z trzech głównych części.

Pierwszym z nich są pliki html, które budują strukturę naszej strony, ale nie zawierają ani minimalnego układu.

Po drugie mamy pliki css, czyli pliki stylów, które stylizują i układają naszą stronę internetową.

Są one dość łatwe do odczytania i zrozumienia, dlatego nie będę ich wyjaśniał.

Na koniec mamy Javascript, z dwiema bibliotekami.

Dwie używane biblioteki to SocketIO i URLSearchParams.

SocketIO umożliwia wysyłanie wiadomości z backendu do frontendu i na odwrót.

Wiadomości mogą być wysyłane do jednego klienta, ale także do wielu klientów (Broadcast)

> Gniazdo IO Javascript

> Gniazdo IO Python

Na powyższych obrazkach widać jedno z połączeń Socket wykonanych w tym projekcie.

Polecenie wysyłania wiadomości to 'emit', odbieranie odbywa się 'on'.

URLSearchParms umożliwiają łatwe pobieranie wartości z ciągu zapytania.

Przykładowy ciąg zapytania: example.com/index.html?id=1

URLSearchParams zwróci Ci: {'id'='1'}

> Przykład URLSearchParams

Zaplecze

Backend jest w pełni napisany w Pythonie z kilkoma bibliotekami.

Pierwszą importowaną przez nas biblioteką jest 'Flask'. Ta biblioteka jest potrzebna do stworzenia API, do wykonania wszystkich działań CRUD dla bazy danych MySQL. CRUD to skrót od Create Read, Update Delete.

> Kolba

Powyższy obrazek pokazuje kilka „tras” Flask. Przechodząc do trasy, automatycznie wykonasz metodę 'GET', kod zostanie wykonany i otrzymasz wartość z metody return. Istnieją również inne metody, takie jak 'POST' i 'DELETE'. Aby przetestować takie metody, będziesz potrzebować programu takiego jak Postman.

Następną biblioteką importu jest SocketIO, którą wyjaśniłem już w sekcji dotyczącej interfejsu.

Kolejny to GPIO.

Pozwala to kontrolować piny GPIO Rapsberry Pi.

Najważniejsze polecenia to:

  • GPIO.setmode(GPIO. BCM) Wybierz konfigurację pinów.
  • GPIO.output(, GPIO. LOW lub GPIO. HIGH) Wpisz LOW lub HIGH do pinu.
  • GPIO.setup(,) Zdefiniuj PIN jako wejście lub wyjście lub pulldown lub pullup

Dalej mamy wątki.

Jedyne polecenia, których używamy to:

  • Wątek(cel=)
  • .początek()

Korzystając z wątków, możemy uruchomić wiele instancji kodu jednocześnie. W ten sposób możemy mierzyć odległość i jednocześnie nasłuchiwać przychodzących wiadomości socket io.

Pierwsze polecenie Thread(target=) utworzy klasę Thread, która po uruchomieniu funkcji 'start()' uruchomi funkcję w słowie kluczowym 'target', które zostało podane przy tworzeniu klasy.

Dalej mamy bibliotekę czujnika kolorów, która jest dość prosta. Nie będę wyjaśniał tej biblioteki, ponieważ metody są bardzo jasne i wyjaśnione w kodzie.

Ostatnio mamy sieci. Dzięki temu możemy pobrać adres IP, którego używamy do połączenia bezprzewodowego i przewodowego.

Ostatnio sam zrobiłem kilka zajęć z czujnika odległości, diody LED i LCD.

Nie wyjaśnię, jak to działa.

Krok 9: Krok 9: Tworzenie sprawy

Krok 9: Tworzenie sprawy
Krok 9: Tworzenie sprawy
Krok 9: Tworzenie sprawy
Krok 9: Tworzenie sprawy
Krok 9: Tworzenie sprawy
Krok 9: Tworzenie sprawy

Do tego projektu stworzyłem drewnianą skrzynkę.

Drewno jest lekkie, cienkie i nie kosztuje dużo.

Jako wymiary użyłem:

  • Wysokość: 5 cm
  • Szerokość: 10,5 cm
  • Długość: 12,5 cm

W przypadku czujników należy dodać 2 otwory i umieścić je obok siebie.

Po utworzeniu obudowy zainstaluj czujniki, LED i LCD.

Krok 10: Ostatnie kroki

Wszystko jest w zasadzie zrobione.

Teraz musimy tylko upewnić się, że nasz kod uruchomi się w momencie, gdy podłączymy nasze źródło zasilania.

Jest na to wiele metod.

> Przykłady

Użyjemy pierwszej metody:

Wykonaj tę linię: 'sudo nano /etc/rc.local'

Dodaj swoje polecenie, aby uruchomić kod: 'sudo python3'

Zapisz plik za pomocą Ctrl-X.

Jeśli masz problemy z edycją. Powtórz ten krok, ale najpierw wykonaj sudo -i.

Zalecana: