App4: Sipariş Verirken Ek Malzeme Ücreti Hesaplama

Kazanımlar
Problem çözme, öğrendiklerini paylaşma, eleştirel ve analitik düşünme becerisi kazanır.
Android telefon sistemi ve QR kod sistemi ile tanışır.
.text ve .math .variable .checkbox bloklarını öğrenir.
Bilgisayar
Android telefon
MIT AI2 telefon uygulaması
Google hesabı
Online App Inventor programı
USB şarj kablosu
http://ai2.appinventor.mit.edu/ adresine girerek App Inventor’u açalım ve buradan New Project diyerek yeni proje başlatalım.
Ardından uygulamayı başlattığınızda telefonunuzun ekranında çıkacak olan görüntünün oluşturulması adımına geçelim.
Bu tasarımı oluşturmak için gerekli olan App Inventor araçları; 2 x Label, 4 x Checkbox, 1 x Button.
User Interface bölümünden Label ekleyelim.
Properties bölümünden Text alanına şu ifadeleri yazalım.
Birinci label için: “Listedeki ürünler seçildi mi?”, ikinci label için: “Ek Malzemelerin seçimi sonucunda ödenecek tutar:” ve üçüncü label için: “0” İfadelerini yazalım.
User Interface bölümünden CheckBox ekleyelim.
Birinci checkbox ifadesi: “Köri Sosu”, ikinci checkbox ifadesi: “Soğan Halkası”, üçüncü checkbox ifadesi: “Sarımsaklı Sos” ve dördüncü checkbox ifadesi: “Ballı Hardal” olsun.
User Interface bölümünden Button ekleyelim.
Properties bölümünden text ifadesi olarak “Hesapla” yazalım.
Bu işlemleri tamamladıktan sonra uygulamanın telefonda nasıl göründüğüne bakmak için Connect menüsünden “AI Companion” seçelim.
Bilgisayarınızın ekranında bir QR kod ve ayrıca giriş kodu görseli gelecektir.
Bu “QR Code” veya “Code”değerlerini Android telefonunuzdaki AppInventor2 uygulamasını çalıştırdığınızda ekrana gelecek olan alanları kullanarak giriş yapabilirsiniz.
Telefonunuzun ekranına gelen görüntüde “connect with code” ve “scan QR code” şeklinde 2 buton olacaktır.
Buradaki seçeneklerden birini seçerek ilerleyelim.
Seçim yapıldıktan sonra hazırlamış olduğumuz tasarım Android telefonun ekranında görüntülenmiş olacak.
Tasarım aşaması tamamlandıktan sonra kod yazma aşamasına geçelim.
Bilgisayardan açmış olduğunuz App Inventor2 sayfasının sağ üst köşesinde bulunan Blocks butonuna tıklayalım ve kod yazma ekranına geçelim.
Uygulama başlatıldığında ekrandaki malzemelerden hangileri seçildiyse ödenecek olan tutarı hesapla butonuna bastığımızda çalışacak kod bloklarını yazalım.
Blocks bölümünden Buton1 aracını seçelim ve açılan ekrandan “when Button1 .click do” bloğunu alalım.
Blocks bölümünden Variables aracını seçelim ve açılan ekrandan “initialize global name to” bloğunu alalım ve değişken adını “tutar” yapalım.
Tutar değişkeni uygulama başladığında alacağı değer 20 olacak.
Blocks bölümünden Control menüsünü seçelim.
“if then..” bloğunu alalım.
Koşul ifadesi olarak ise “checkbox” seçeneği seçili durumda ise olacak şekilde bir koşul oluşturalım.
Bu işlemi diğer 4 checkbox için de yapalım.
Koşulun sağlanması durumunda tutar değişkeni seçilen malzemenin fiyatı son tutarın üzerine eklenecek olan kod bloklarını yazalım.
Bu bölümde her butona basıldığında tutar değişkeni başlangıçta 20 olacak daha sonra da koşulların sağlanması durumunda toplam tutara eklenecek olan kod bloklarını yazalım.
“Initialize global tutar to” bloğunun üzerine mouse ile geldiğinizde açılacak pencereden “Set global tutar to” bloğunu alalım ve Math bölümünden “toplama” bloğunu alalım ve ekleyelim.
Bu adımda blokları birleştirelim ve uygulamayı telefonda çalıştıralım.