MIT App Inventor – Szövegbeviteli példa kezdőknek

Android alkalmazás használata során szükség lehet a felhasználók által megadott szöveg kezelésére. Ezzel az egyszerű kis példával szeretném bemutatni egy beírt szöveg feldolgozását.

NVIDIA SHIELD Android TV Pro Multimedia Player; 4K HDR Filme, Live Sport, Dolby Vision-Atmos, KI-unterstützte Video-Hochskalierung, GeForce NOW Cloud Gaming, Google Assistant integriert

NVIDIA SHIELD TV Pro

Android TV Pro Multimedia Player; 4K HDR Filme, Live Sport, Dolby Vision-Atmos, KI-unterstützte Video-Hochskalierung, GeForce NOW Cloud Gaming, Google Assistant integriert

werbung – amazon.de

A cikkhez kapcsolódó zip fájlokban megtalálható a projekt fájl(.aia) és a telepíthető alkalmazás (.apk) is. Nincs széleskörűen tesztelve, kizárólag a saját telefonomon próbáltam, ezért csak saját felelőségedre telepítsd.

Készítsük el az alkalmazásunk kinézetét a ‘Designer’ oldalon.

Először két ‘HorizontalArrangement’ elrendezést húzzunk a képernyőre, majd helyezzünk el az elsőn egy ‘Label’ cimkét a megjelenítendő szövegnek. A második elrendezésre kell egy ‘TextBox’ szövegdoboz és egy ‘Button’ gomb.

Ezután végezzük el az egyes komponensek beállításait a ‘Properties’ oszlopban. Lehet kicsit kísérletezni a színekkel, méretekkel, stb.

MIT App Inventor - Designer - Textbox példa
MIT App Inventor – Designer – Textbox példa

Ha ezzel megvagyunk lépjünk a blokkszerkesztőhöz. Alább láthatjuk, hogy a „Kód” nem túl bonyolult.

A ‘Button1’ gomb megnyomása után eltávolítjuk az üres karaktereket majd ellenőrizzük, hogy a ‘TextBox1’ szövegdoboz nem üres. Ha üres, írjunk a ‘Label1’ mezőbe egy hibaüzenetet, hogy „A beviteli mező üres!”, ellenkező esetben beírjuk a megadott szöveget.

MIT App Inventor - Blokkszerkesztő- Textbox példa
MIT App Inventor – Blokkszerkesztő- Textbox példa

Lássuk mit csináltunk, nyissuk meg a telefonra telepített ‘MIT AI2 Companion‘ alkalmazást, majd szkenneljük be a QR kódott.

MIT App Inventor - Textbox példa
MIT App Inventor – Textbox példa

A Projektfájlok letölthethetők innen: TextBoxExample.zip

Módosíthatjuk az alkalmazásunkat, hogy a következő indításkor a bezárást megelőző szöveg jelenjen meg a ‘Label1’ mezőben. A ‘Designer’ oldalon adjunk hozzá egy ‘TinyDB’ adatbázis komponenst, Egyszerűen húzzuk a telefon képernyőjére.

MIT App Inventor Designer - Textbox-adatbázissal példa
MIT App Inventor Designer – Textbox-adatbázissal példa

Menjünk a blokkszerkesztő oldalra, és módosítsuk a „kódot” az alábbiak szerint.

MIT App Inventor Blokkszerkesztő - Textbox-adatbázissal példa
MIT App Inventor Blokkszerkesztő – Textbox-adatbázissal példa

Az első blokkban az alkalmazás indításakor kiolvassuk az adatbázisból az előzőleg mentett szöveget. Ha nincs ilyen akkor az alapértelmezett szöveget írjuk be a ‘Label1’-be.

A második blokkban az előző példát kiegészítve beírjuk a ‘TextBox1’ értékét az adatbázisba, hogy a következő indításkor felhasználhassuk ezt a szöveget.

A második példa fájljait itt találod: TextBoxDatabaseExample.zip

Sok sikert!