lvgl
v9.2.2
الإنجليزية | 中文 | البرتغالية في البرازيل | 日本語
الموقع | مستندات | المنتدى | العروض التوضيحية | خدمات
ناضجة ومعروفة
LVGL هي مكتبة الرسومات المدمجة المجانية والمفتوحة المصدر الأكثر شيوعًا لإنشاء واجهات مستخدم جميلة لأي نوع MCU وMPU وشاشة العرض. إنه مدعوم من قبل البائعين والمشاريع الرائدة في الصناعة مثل Arm وSTM32 وNXP وEspressif وNuvoton وArduino وRT-Thread وZephyr وNuttX وAdafruit وغيرها الكثير.
ميزة غنية
إنه يحتوي على جميع الميزات اللازمة لإنشاء واجهات المستخدم الرسومية الحديثة والجميلة: أكثر من 30 عنصر واجهة مستخدم مدمج ونظام أسلوب قوي ومدير تخطيط مستوحى من الويب ونظام طباعة يدعم العديد من اللغات. لدمج LVGL في النظام الأساسي الخاص بك، كل ما تحتاجه هو ما لا يقل عن 32 كيلو بايت من ذاكرة الوصول العشوائي و128 كيلو بايت فلاش، ومترجم C، ومخزن مؤقت للإطار، ومخزن مؤقت بحجم شاشة 1/10 على الأقل للعرض.
خدمات
فريقنا على استعداد لمساعدتك في تصميم الرسومات وتنفيذ واجهة المستخدم والخدمات الاستشارية. اتصل بنا إذا كنت بحاجة إلى بعض الدعم أثناء تطوير مشروع واجهة المستخدم الرسومية التالي.
مجاني ومحمول
الأدوات والأنماط والتخطيطات والمزيد
ملزمة وبناء الدعم
المستندات والأدوات والخدمات
إذا وفر لك LVGL الكثير من الوقت والمال أو كنت تستمتع باستخدامه، ففكر في دعم تطويره.
كيف نصرف التبرعات؟
هدفنا هو تقديم تعويض مالي للأشخاص الذين يبذلون قصارى جهدهم لصالح LVGL. وهذا يعني أنه ليس فقط المشرفين ولكن أي شخص ينفذ ميزة رائعة يجب أن يحصل على دفعة من الأموال المتراكمة. نستخدم التبرعات لتغطية تكاليفنا التشغيلية مثل الخوادم والخدمات ذات الصلة.
كيفية التبرع؟
نحن نستخدم رعاة GitHub حيث يمكنك بسهولة إرسال تبرعات لمرة واحدة أو متكررة. يمكنك أيضًا الاطلاع على جميع نفقاتنا بطريقة شفافة.
كيف تحصل على أموال مقابل مساهمتك؟
إذا قام شخص ما بتنفيذ أو إصلاح مشكلة تم تصنيفها على أنها مدعومة، فسوف يحصل على دفعة مقابل هذا العمل. نحن نقدر الوقت المطلوب وتعقيد وأهمية المشكلة ونحدد السعر وفقًا لذلك. للمشاركة فقط قم بالتعليق على مشكلة دعائية قائلًا "مرحبًا، أود التعامل معها. هذه هي الطريقة التي أخطط بها لإصلاحها/تنفيذها...". يعتبر العمل جاهزًا عندما تتم الموافقة عليه ودمجه بواسطة المشرف. بعد ذلك يمكنك الإرسال والنفقة على opencollective.com وستتلقى الدفعة في غضون أيام قليلة.
المنظمات الداعمة لـ LVGL
الأفراد الذين يدعمون LVGL
LVGL متاح على النحو التالي:
اطلع على بعض الأمثلة حول إنشاء عناصر واجهة المستخدم، باستخدام التخطيطات وتطبيق الأنماط. ستجد كود C وMicroPython، وروابط لتجربة الأمثلة أو تحريرها في محرر MicroPython عبر الإنترنت.
لمزيد من الأمثلة، راجع مجلد الأمثلة.
/*Change the active screen's background color*/
lv_obj_set_style_bg_color ( lv_screen_active (), lv_color_hex ( 0x003a57 ), LV_PART_MAIN );
/*Create a white label, set its text and align it to the center*/
lv_obj_t * label = lv_label_create ( lv_screen_active ());
lv_label_set_text ( label , "Hello world" );
lv_obj_set_style_text_color ( label , lv_color_hex ( 0xffffff ), LV_PART_MAIN );
lv_obj_align ( label , LV_ALIGN_CENTER , 0 , 0 ); # Change the active screen's background color
scr = lv . screen_active ()
scr . set_style_bg_color ( lv . color_hex ( 0x003a57 ), lv . PART . MAIN )
# Create a white label, set its text and align it to the center
label = lv . label ( lv . screen_active ())
label . set_text ( "Hello world" )
label . set_style_text_color ( lv . color_hex ( 0xffffff ), lv . PART . MAIN )
label . align ( lv . ALIGN . CENTER , 0 , 0 )
lv_obj_t * button = lv_button_create ( lv_screen_active ()); /*Add a button to the current screen*/
lv_obj_center ( button ); /*Set its position*/
lv_obj_set_size ( button , 100 , 50 ); /*Set its size*/
lv_obj_add_event_cb ( button , button_event_cb , LV_EVENT_CLICKED , NULL ); /*Assign a callback to the button*/
lv_obj_t * label = lv_label_create ( button ); /*Add a label to the button*/
lv_label_set_text ( label , "Button" ); /*Set the labels text*/
lv_obj_center ( label ); /*Align the label to the center*/
...
void button_event_cb ( lv_event_t * e )
{
printf ( "Clickedn" );
} def button_event_cb ( e ):
print ( "Clicked" )
# Create a Button and a Label
button = lv . button ( lv . screen_active ())
button . center ()
button . set_size ( 100 , 50 )
button . add_event_cb ( button_event_cb , lv . EVENT . CLICKED , None )
label = lv . label ( button )
label . set_text ( "Button" )
label . center ()
lv_obj_set_flex_flow ( lv_screen_active (), LV_FLEX_FLOW_COLUMN );
lv_obj_set_flex_align ( lv_screen_active (), LV_FLEX_ALIGN_CENTER , LV_FLEX_ALIGN_START , LV_FLEX_ALIGN_CENTER );
lv_obj_t * cb ;
cb = lv_checkbox_create ( lv_screen_active ());
lv_checkbox_set_text ( cb , "Apple" );
lv_obj_add_event_cb ( cb , event_handler , LV_EVENT_ALL , NULL );
cb = lv_checkbox_create ( lv_screen_active ());
lv_checkbox_set_text ( cb , "Banana" );
lv_obj_add_state ( cb , LV_STATE_CHECKED );
lv_obj_add_event_cb ( cb , event_handler , LV_EVENT_ALL , NULL );
cb = lv_checkbox_create ( lv_screen_active ());
lv_checkbox_set_text ( cb , "Lemon" );
lv_obj_add_state ( cb , LV_STATE_DISABLED );
lv_obj_add_event_cb ( cb , event_handler , LV_EVENT_ALL , NULL );
cb = lv_checkbox_create ( lv_screen_active ());
lv_obj_add_state ( cb , LV_STATE_CHECKED | LV_STATE_DISABLED );
lv_checkbox_set_text ( cb , "Melonnand a new line" );
lv_obj_add_event_cb ( cb , event_handler , LV_EVENT_ALL , NULL ); def event_handler ( e ):
code = e . get_code ()
obj = e . get_target_obj ()
if code == lv . EVENT . VALUE_CHANGED :
txt = obj . get_text ()
if obj . get_state () & lv . STATE . CHECKED :
state = "Checked"
else :
state = "Unchecked"
print ( txt + ":" + state )
lv . screen_active (). set_flex_flow ( lv . FLEX_FLOW . COLUMN )
lv . screen_active (). set_flex_align ( lv . FLEX_ALIGN . CENTER , lv . FLEX_ALIGN . START , lv . FLEX_ALIGN . CENTER )
cb = lv . checkbox ( lv . screen_active ())
cb . set_text ( "Apple" )
cb . add_event_cb ( event_handler , lv . EVENT . ALL , None )
cb = lv . checkbox ( lv . screen_active ())
cb . set_text ( "Banana" )
cb . add_state ( lv . STATE . CHECKED )
cb . add_event_cb ( event_handler , lv . EVENT . ALL , None )
cb = lv . checkbox ( lv . screen_active ())
cb . set_text ( "Lemon" )
cb . add_state ( lv . STATE . DISABLED )
cb . add_event_cb ( event_handler , lv . EVENT . ALL , None )
cb = lv . checkbox ( lv . screen_active ())
cb . add_state ( lv . STATE . CHECKED | lv . STATE . DISABLED )
cb . set_text ( "Melon" )
cb . add_event_cb ( event_handler , lv . EVENT . ALL , None )
lv_obj_t * slider = lv_slider_create ( lv_screen_active ());
lv_slider_set_value ( slider , 70 , LV_ANIM_OFF );
lv_obj_set_size ( slider , 300 , 20 );
lv_obj_center ( slider );
/*Add local styles to MAIN part (background rectangle)*/
lv_obj_set_style_bg_color ( slider , lv_color_hex ( 0x0F1215 ), LV_PART_MAIN );
lv_obj_set_style_bg_opa ( slider , 255 , LV_PART_MAIN );
lv_obj_set_style_border_color ( slider , lv_color_hex ( 0x333943 ), LV_PART_MAIN );
lv_obj_set_style_border_width ( slider , 5 , LV_PART_MAIN );
lv_obj_set_style_pad_all ( slider , 5 , LV_PART_MAIN );
/*Create a reusable style sheet for the INDICATOR part*/
static lv_style_t style_indicator ;
lv_style_init ( & style_indicator );
lv_style_set_bg_color ( & style_indicator , lv_color_hex ( 0x37B9F5 ));
lv_style_set_bg_grad_color ( & style_indicator , lv_color_hex ( 0x1464F0 ));
lv_style_set_bg_grad_dir ( & style_indicator , LV_GRAD_DIR_HOR );
lv_style_set_shadow_color ( & style_indicator , lv_color_hex ( 0x37B9F5 ));
lv_style_set_shadow_width ( & style_indicator , 15 );
lv_style_set_shadow_spread ( & style_indicator , 5 );
4
/*Add the style sheet to the slider's INDICATOR part*/
lv_obj_add_style ( slider , & style_indicator , LV_PART_INDICATOR );
/*Add the same style to the KNOB part too and locally overwrite some properties*/
lv_obj_add_style ( slider , & style_indicator , LV_PART_KNOB );
lv_obj_set_style_outline_color ( slider , lv_color_hex ( 0x0096FF ), LV_PART_KNOB );
lv_obj_set_style_outline_width ( slider , 3 , LV_PART_KNOB );
lv_obj_set_style_outline_pad ( slider , -5 , LV_PART_KNOB );
lv_obj_set_style_shadow_spread ( slider , 2 , LV_PART_KNOB ); # Create a slider and add the style
slider = lv . slider ( lv . screen_active ())
slider . set_value ( 70 , lv . ANIM . OFF )
slider . set_size ( 300 , 20 )
slider . center ()
# Add local styles to MAIN part (background rectangle)
slider . set_style_bg_color ( lv . color_hex ( 0x0F1215 ), lv . PART . MAIN )
slider . set_style_bg_opa ( 255 , lv . PART . MAIN )
slider . set_style_border_color ( lv . color_hex ( 0x333943 ), lv . PART . MAIN )
slider . set_style_border_width ( 5 , lv . PART . MAIN )
slider . set_style_pad_all ( 5 , lv . PART . MAIN )
# Create a reusable style sheet for the INDICATOR part
style_indicator = lv . style_t ()
style_indicator . init ()
style_indicator . set_bg_color ( lv . color_hex ( 0x37B9F5 ))
style_indicator . set_bg_grad_color ( lv . color_hex ( 0x1464F0 ))
style_indicator . set_bg_grad_dir ( lv . GRAD_DIR . HOR )
style_indicator . set_shadow_color ( lv . color_hex ( 0x37B9F5 ))
style_indicator . set_shadow_width ( 15 )
style_indicator . set_shadow_spread ( 5 )
# Add the style sheet to the slider's INDICATOR part
slider . add_style ( style_indicator , lv . PART . INDICATOR )
slider . add_style ( style_indicator , lv . PART . KNOB )
# Add the same style to the KNOB part too and locally overwrite some properties
slider . set_style_outline_color ( lv . color_hex ( 0x0096FF ), lv . PART . KNOB )
slider . set_style_outline_width ( 3 , lv . PART . KNOB )
slider . set_style_outline_pad ( - 5 , lv . PART . KNOB )
slider . set_style_shadow_spread ( 2 , lv . PART . KNOB )
lv_obj_t * ltr_label = lv_label_create ( lv_screen_active ());
lv_label_set_text ( ltr_label , "In modern terminology, a microcontroller is similar to a system on a chip (SoC)." );
lv_obj_set_style_text_font ( ltr_label , & lv_font_montserrat_16 , 0 );
lv_obj_set_width ( ltr_label , 310 );
lv_obj_align ( ltr_label , LV_ALIGN_TOP_LEFT , 5 , 5 );
lv_obj_t * rtl_label = lv_label_create ( lv_screen_active ());
lv_label_set_text ( rtl_label , "מעבד, או בשמו המלא יחידת עיבוד מרכזית (באנגלית: CPU - Central Processing Unit)." );
lv_obj_set_style_base_dir ( rtl_label , LV_BASE_DIR_RTL , 0 );
lv_obj_set_style_text_font ( rtl_label , & lv_font_dejavu_16_persian_hebrew , 0 );
lv_obj_set_width ( rtl_label , 310 );
lv_obj_align ( rtl_label , LV_ALIGN_LEFT_MID , 5 , 0 );
lv_obj_t * cz_label = lv_label_create ( lv_screen_active ());
lv_label_set_text ( cz_label ,
"嵌入式系统（Embedded System），n是一种嵌入机械或电气系统内部、具有专一功能和实时计算性能的计算机系统。" );
lv_obj_set_style_text_font ( cz_label , & lv_font_simsun_16_cjk , 0 );
lv_obj_set_width ( cz_label , 310 );
lv_obj_align ( cz_label , LV_ALIGN_BOTTOM_LEFT , 5 , -5 ); ltr_label = lv . label ( lv . screen_active ())
ltr_label . set_text ( "In modern terminology, a microcontroller is similar to a system on a chip (SoC)." )
ltr_label . set_style_text_font ( lv . font_montserrat_16 , 0 );
ltr_label . set_width ( 310 )
ltr_label . align ( lv . ALIGN . TOP_LEFT , 5 , 5 )
rtl_label = lv . label ( lv . screen_active ())
rtl_label . set_text ( "מעבד, או בשמו המלא יחידת עיבוד מרכזית (באנגלית: CPU - Central Processing Unit)." )
rtl_label . set_style_base_dir ( lv . BASE_DIR . RTL , 0 )
rtl_label . set_style_text_font ( lv . font_dejavu_16_persian_hebrew , 0 )
rtl_label . set_width ( 310 )
rtl_label . align ( lv . ALIGN . LEFT_MID , 5 , 0 )
font_simsun_16_cjk = lv . font_load ( "S:../../assets/font/lv_font_simsun_16_cjk.fnt" )
cz_label = lv . label ( lv . screen_active ())
cz_label . set_style_text_font ( font_simsun_16_cjk , 0 )
cz_label . set_text ( "嵌入式系统（Embedded System）， n是一种嵌入机械或电气系统内部、具有专一功能和实时计算性能的计算机系统。" )
cz_label . set_width ( 310 )
cz_label . align ( lv . ALIGN . BOTTOM_LEFT , 5 , - 5 )ستوجهك هذه القائمة للبدء في استخدام LVGL خطوة بخطوة.
تعرف على LVGL
البدء في استخدام LVGL
كن محترفًا
احصل على المساعدة ومساعدة الآخرين
تم إنشاء LVGL LLC لتوفير خلفية قوية لمكتبة LVGL ولتقديم العديد من أنواع الخدمات لمساعدتك في تطوير واجهة المستخدم. مع أكثر من 15 عامًا من الخبرة في واجهة المستخدم وصناعة الرسومات، يمكننا مساعدتك في الارتقاء بواجهة المستخدم الخاصة بك إلى المستوى التالي.
تحقق من العروض التوضيحية لدينا كمرجع. لمزيد من المعلومات قم بإلقاء نظرة على صفحة الخدمات.
اتصل بنا وأخبرنا كيف يمكننا المساعدة.
LVGL هو مشروع مفتوح والمساهمة موضع ترحيب كبير. هناك العديد من الطرق للمساهمة بدءًا من مجرد التحدث عن مشروعك، مرورًا بكتابة الأمثلة، وتحسين التوثيق، وإصلاح الأخطاء، أو حتى استضافة مشروعك الخاص ضمن مؤسسة LVGL.
للحصول على وصف تفصيلي لفرص المساهمة، قم بزيارة قسم المساهمة في الوثائق.
لقد ترك أكثر من 300 شخص بصماتهم بالفعل في LVGL. كن واحدا منهم! نراكم هنا! ؟
... وغيرها الكثير.
