آموزش ایجاد رابط کاربری گرافیکی در SL4A

3 سال پیش

امتیاز دهید post

آموزش ایجاد رابط کاربری گرافیکی در SL4A

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

رابط کاربری گرافیکی (GUI) مجموعه ای از اجزای گرافیکی را نشان می دهد که کاربر را قادر می سازد تا به مرور به دسترسی و تعامل با عملکردهای برنامه بپردازد.

دو رویکرد اساسی برای تعامل کاربر با SL4A وجود دارد:

جعبه های گفتگو مانند هشدارها.
استفاده از HTML و جاوا اسکریپت برای ساختن رابط کاربری و سپس پایتون در پشت صحنه برای انجام هرگونه پردازش اضافی.

این درس هر دو رویکرد را توضیح می دهد.

جعبه گفتگوی پایتون – مبتنی بر رابط کاربری گرافیکی

SL4A شامل نمای UI برای دسترسی به عناصر UI اولیه ارائه شده توسط API اندروید است. این توابع هنگام فراخوانی یک شیء نتیجه را به عنوان یک تعداد نام برده برمی گردانند. به هر نتیجه یک شناسه منحصر به فرد برای هدف ردیابی اختصاص داده می شود. عنصر دوم نتیجه است. این نشان دهنده ورودی کاربر است. این تاپل همچنین شامل خطای عنصر سوم است تا در مورد هرگونه خطای احتمالی که با آن مواجه شده است، عامل فراخوانی را بازخورد دهد. اگر خطایی رخ نداد این عنصر روی هیچ کدام تنظیم شده است.

مثال ها

یک نمونه تست ساده

import android 
droid = android.Android() 
uname = droid.getInput("Enter your name") 
print uname  
droid.makeToast("Hello %s" %uname.result)

import android

droid = android.Android()

uname = droid.getInput("Enter your name")

print uname

droid.makeToast("Hello %s" %uname.result)

نوار پیشرفت افقی

import android 
   droid = android.Android() 
   title = "Progress" 
   str = "Loading..." 
   droid.dialogCreateHorizontalProgress(title,str,100) 
   droid.showDialog() 
    
   for x in range(0,99) 
      time.sleep(0.1) 
      droid.dialogSetCurrentProgress(x) 
        
   droid.dialogDismiss()

import android

droid = android.Android()

title = "Progress"

str = "Loading..."

droid.dialogCreateHorizontalProgress(title,str,100)

droid.showDialog()

for x in range(0,99)

time.sleep(0.1)

droid.dialogSetCurrentProgress(x)

droid.dialogDismiss()

جعبه های گفتگوی مودال در مقابل غیر مودال

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

یک مثال معمولی از این مورد، جعبه گفتگوی هشدار است. تا زمانی که کاربر عملی را انجام ندهد، هشدار بسته نمی شود.

تصویر زیر نمونه ای از یک کادر محاوره ای مودال است.

Modal Dialog Box
به طور خلاصه، هنگامی که قبل از ادامه اجرا به ورودی کاربر نیاز دارید، از یک جعبه گفتگوی مودال استفاده کنید.

رابط کاربری گرافیکی پایتون با HTML

SL4A امکان ایجاد رابط کاربری گرافیکی (GUI) را بر اساس CSS ،HTML ،JavaScript و Python فراهم می کند. این رویکرد از HTML و جاوا اسکریپت برای ساختن رابط کاربری CSS برای افزایش ظاهر و سازگاری عناصر و فونت های HTML و پایتون برای مدیریت هرگونه پردازش اضافی استفاده می کند.

مثال زیر یک مثال اولیه GUI HTML را نشان می دهد –

1. Speech.html

&lt;html&gt; 
   &lt;head&gt; 
      &lt;title&gt;Text To Speech&lt;/title&gt; 
        
      &lt;script&gt; 
         var droid = new Android(); 
         var speak = function(){ 
            droid.postEvent("say",document.getElementById("say").value); 
         } 
      &lt;/script&gt; 
        
   &lt;/head&gt;
    
   &lt;body&gt; 
      &lt;form onsubmit = "speak()";return false;”&gt; 
         &lt;label for = "say"&gt;What is your message?&lt;/label&gt; 
         &lt;input type = "text" id = "say"/&gt; 
         &lt;input type = "submit" value = "Speak"/&gt; 
      &lt;/form&gt; 
   &lt;/body&gt; 
    
&lt;/html&gt;

<html>

<head>

<title>Text To Speech</title>

var droid = new Android();

var speak = function(){

droid.postEvent("say",document.getElementById("say").value);

}

</script>

</head>

<body>

<label for = "say">What is your message?</label>

</form>

</body>

</html>

2. txtToSpeech.py

import android 
droid = android.Android() 
droid.webViewShow(‘file:///sdcard/sl4a/scripts/Speech.html’) 

while True: 
   result = droid.waitForEvent(‘say’).result 
   droid.ttsSpeak(result[‘data’])

import android

droid = android.Android()

droid.webViewShow(‘file:///sdcard/sl4a/scripts/Speech.html’)

while True:

result = droid.waitForEvent(‘say’).result

droid.ttsSpeak(result[‘data’])

هر دو فایل – Speech.html و txtToSpeech.py باید در فهرست/sdcard/sl4a/scripts دستگاه قرار داشته باشند. برای راه اندازی فایل HTML، اسکریپت پایتون را اجرا کنید.

این فایل توسط فراخوانی API webViewShow راه اندازی می شود. وقتی روی دکمه Speak کلیک می شود، رویداد ایجاد می شود.

منبع.

لیست جلسات قبل آموزش SL4A

امتیاز دهید post

برچسب ها : آموزش SL4A آموزش برنامه نویسی موبایل

نویسنده مطلب saber

آموزش ایجاد رابط کاربری گرافیکی در SL4A

آموزش ایجاد رابط کاربری گرافیکی در SL4A

جعبه گفتگوی پایتون – مبتنی بر رابط کاربری گرافیکی

مثال ها

جعبه های گفتگوی مودال در مقابل غیر مودال

رابط کاربری گرافیکی پایتون با HTML

1. Speech.html

2. txtToSpeech.py

لیست جلسات قبل آموزش SL4A

دیدگاه شما

بدون دیدگاه

آموزش ایجاد رابط کاربری گرافیکی در SL4A

جعبه گفتگوی پایتون – مبتنی بر رابط کاربری گرافیکی

مثال ها

جعبه های گفتگوی مودال در مقابل غیر مودال

رابط کاربری گرافیکی پایتون با HTML

1. Speech.html

2. txtToSpeech.py

لیست جلسات قبل آموزش SL4A

دیدگاه شما

برای صرف‌نظر کردن از پاسخ‌گویی اینجا را کلیک نمایید.

بدون دیدگاه