آموزش رزبری پای

رابط کاربری گرافیکی GUI پایتون در رزبری پای

در آموزش امروز، می‌خواهم نحوه ایجاد رابط کاربری گرافیکی در Raspberry Pi را به شما نشان دهم. کتابخانه‌های شخص ثالث مختلفی در دسترس هستند و یکی از آنها tkinter است. من کتابخانه های مختلف را امتحان کرده ام و آن را بیشتر دوست داشتم.

رابط کاربری گرافیکی مخفف Graphical User Interface است و برای ارائه یک فرم قابل ارائه به پروژه شما استفاده می شود. چند دکمه به رابط کاربری گرافیکی خود اضافه می کنیم و LED خود را با استفاده از دکمه ها روشن یا خاموش می کنیم. این یک آموزش کاملاً ابتدایی است اما ضروری است که قبل از کار روی پروژه های بزرگتر پوشش داده شود. بنابراین، بیایید با نحوه ایجاد رابط کاربری گرافیکی در Raspberry Pi شروع کنیم:

نحوه ایجاد رابط کاربری گرافیکی در رزبری پای

در اینجا تصویری از اتصالات و پیکربندی ما آمده است:

نحوه ایجاد رابط کاربری گرافیکی در رزبری پای

یک فایل جدید در Python IDLE خود باز کنید و آن را ذخیره کنید، من نام آن را CreateGUI.py گذاشته ام. کد کامل در فایل دانلودی انتهای صفحه قرار گرفته است. در اینجا مرحله به مرحله کد را بررسی میکنیم.

در ابتدای کد ما کتابخانه‌ های خود را در پایتون وارد می‌کنیم، بنابراین کد مثل زیر است:

import RPi.GPIO as GPIO
import time
from tkinter import *
import tkinter.font

در کد بالا مشاهده می کنید که کتابخانه جدیدی وارد کرده ایم که tkinter library است و فونت را نیز از آن وارد کرده ایم. اکنون می‌خواهیم تنظیمات اولیه را برای پین LED خود انجام دهیم. این کد برای آن است:

LED = 11 # pin11
GPIO.setwarnings(False)
GPIO.setmode(GPIO.BOARD) # استفاده از شماره GPIO
GPIO.setup(LED, GPIO.OUT) # خروجی کردن پین LED
GPIO.output(LED, GPIO.LOW) # در ابتدا خاموش باشد

در کد بالا همه هشدارها را روی False قرار داده ام زیرا هشدارها فقط آزاردهنده هستند و به آن ها نیازی نداریم. پس از آن، حالت شماره پایه های خود را روی GPIO تنظیم کردم. می توانید این حالت را روی BCM نیز تنظیم کنید. در مرحله بعد ما خروجی پین LED خود را تنظیم کرده ایم و آن را LOW کرده ایم.

حالا بیایید مقداری کد برای مقداردهی اولیه رابط کاربری گرافیکی و تنظیمات اولیه قرار دهیم، کد اینجاست:

Gui = Tk()
Gui.title("GUI in Raspberry Pi 3")
Gui.config(background= "#0080FF")
Gui.minsize(700,300)
Font1 = tkinter.font.Font(family = 'Helvetica', size = 24, weight = 'bold')

اول از همه، من یک شی به نام Gui ایجاد کرده ام که در واقع رابط کاربری گرافیکی من است. سپس یک عنوان به آن داده ام که به عنوان نام این رابط کاربری گرافیکی یا نرم افزار ظاهر می شود.

من پس زمینه را آبی روشن کرده ام، خوب به نظر می رسد. حداقل اندازه ای که من تنظیم کرده ام 700*300 است که بر حسب پیکسل (x, y) است. در نهایت ما فونت خود را تنظیم کرده ایم که هنوز از آن استفاده نمی کنیم اما در بخش بعدی استفاده خواهیم کرد. حالا اگر کد خود را اجرا کنید، چیزی مانند شکل زیر دریافت خواهید کرد:

راه اندازی GUI با پایتون در رزبری پای

در شکل بالا می بینید که ما یک پنجره  ساده داریم و عنوان آن نیز وجود دارد. بنابراین، اکنون اجازه دهید ابتدا تعدادی برچسب در رابط کاربری گرافیکی خود اضافه کنیم:

Text1 = Label(Gui,text='LED Status:', font = Font1, fg='#FFFFFF', bg = '#0080FF', padx = 50, pady = 50)
Text1.grid(row=0,column=0)

Text2 = Label(Gui,text='OFF', font = Font1, fg='#FFFFFF', bg = '#0080FF', padx = 0)
Text2.grid(row=0,column=1)

من فکر می کنم این کدها توضیحی هستند، من دو متن “LED Status:” و “OFF” را اضافه کرده ام. من فونت 1 را که در بخش آخر ایجاد کردیم به آنها داده ام و پس زمینه دوباره سفید است و همچنین مقداری padding در جهت x و y اضافه کرده ام تا زیاد به مرز های پنجره نزدیک نشوند.

در این کدنویسی tkinter GUI ما سیستم شبکه ای داریم. تصویر زیر این ایده را به شما نشان می دهد:

همچنین اگر در مورد این مطلب سوالی داشتید در انتهای صفحه در قسمت نظرات بپرسید

سیستم شبکه ای GUI Tkinter

ما هر دو برچسب خود را در ردیف اول اضافه کرده ایم، بنابراین خروجی در تصویر زیر نشان داده شده است.

نمایش وضعیت LED در GUI

حالا بیایید دو دکمه زیر این برچسب ها اضافه کنیم، که LED ما را کنترل می کند و آن را روشن و خاموش می کند. در اینجا کد اضافه کردن دکمه ها در رابط کاربری گرافیکی با استفاده از tkinter آمده است:

Button1 = Button(Gui, text=' LED ON', font = Font1, command = ledON, bg='bisque2', height = 1, width = 10)
Button1.grid(row=1,column=0)

Button2 = Button(Gui, text=' LED OFF', font = Font1, command = ledOFF, bg='bisque2', height = 1, width = 10)
Button2.grid(row=1,column=1)

در کد بالا مشاهده کردید که اکنون این دو دکمه در ردیف دوم قرار گرفته اند بنابراین زیر این برچسب ها قرار می گیرند. تنها چیزی که در اینجا قابل ذکر است command = است، در واقع تابعی است که با فشار دادن آن دکمه اجرا می شود. بنابراین، اکنون باید این توابع را به بالای کدهای Label اضافه کنیم.
بنابراین، در اینجا کدهای این دو تابع آمده است:

def ledON():
    GPIO.output(LED, GPIO.HIGH) # led on
    Text2 = Label(Gui,text=' ON ', font = Font1, bg = '#0080FF', fg='green', padx = 0)
    Text2.grid(row=0,column=1)

def ledOFF():
    GPIO.output(LED, GPIO.LOW) # led off
    Text2 = Label(Gui,text='OFF', font = Font1, bg = '#0080FF', fg='red', padx = 0)
    Text2.grid(row=0,column=1)

در برخی موارد باید ستون ها یا ردیف های خود را ادغام کنید، برای این کار می توانید از کد زیر استفاده کنید. در کد زیر، ستون های سطر آخر را با استفاده از ‘columnspan=2’ ادغام کرده ام و لینک سایت را اضافه کرده ام.

دو ستون اول سطر آخر را با هم ادغام کرده است و این کد است:

Text3 = Label(Gui,text='www.irenx.ir', font = Font1, bg = '#0080FF', fg='#FFFFFF', padx = 50, pady = 50)
Text3.grid(row=2,columnspan=2)

و در نهایت باید کد حلقه اصلی خود را اضافه کنیم که شبیه while(1) در پایتون است که در زیر آورده شده است:

Gui.mainloop()

حالا کد خود را اجرا کنید و چیزی مطابق شکل زیر دریافت خواهید کرد:

طراحی رابط کاربری گرافیکی با پایتون
اگر به مشکلی برخوردید، در نظرات بپرسید.

حالا وقتی روی دکمه “LED ON” کلیک می کنید، LED شما روشن می شود و وقتی روی دکمه “LED OFF” کلیک می کنید، LED شما خاموش می شود. متن وضعیت LED در رابط کاربری گرافیکی از OFF به ON تغییر می کند. هر دو صفحه نمایش Raspberry Pi و تنظیمات سخت افزاری آن در شکل زیر نشان داده شده است:

اتصالات LED و رابط کاربری گرافیکی رزبری پای

این مقاله همه چیز درباره نحوه ایجاد رابط کاربری گرافیکی در Raspberry Pi بود. امیدوارم ایده دقیق ایجاد رابط کاربری گرافیکی را داشته باشید.

موارد موجود در فایل : سورس

دانلود فایل های پروژه

5/5 - (1 امتیاز)

برای دریافت مطالب جدید کانال تلگرام یا پیج اینستاگرام آیرنکس را دنبال کنید.
تصویر از محمد رحیمی

محمد رحیمی

محمد رحیمی هستم. سعی میکنم در آیرنکس مطالب مفید قرار بدهم. سوالات مربوط به این مطلب را در قسمت نظرات همین مطلب اعلام کنید. سعی میکنم در اسرع وقت به نظرات شما پاسخ بدهم.

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد.