INVENTOR wa APP 2 - Vidokezo safi vya Mbele (+ 4 Mfano): Hatua 6

2024 Mwandishi: John Day | [email protected]. Mwisho uliobadilishwa: 2024-01-30 12:51

Tutaona jinsi tunaweza kufanya Programu yako kwenye AI2 ionekane ni ya kupendeza:)

Hakuna nambari wakati huu, vidokezo tu vya programu laini kama mfano 4 juu!

Vifaa

Hatua ya 1: Utangulizi

Hii inaweza kufundishwa kwa kila mtu anayejifunza au kutumia App Inventor 2, programu iliyotengenezwa na MIT.

MIT AI2 ni maendeleo ya bure, rahisi na ya kushangaza ya programu ya smartphone, ambayo ni kamili kwa kila DIY Arduino au kifaa cha elektroniki. Lakini unyenyekevu wake pia humfanya awe mdogo sana, haswa wakati unapojaribu kuifanya programu yako ionekane ni ya kupendeza.

Kusudi la Agizo hili ni kukupa vidokezo vya kuunda mbele nzuri kwa programu yako ya baadaye, ambayo itaonekana kuwa rahisi na ya kifahari, kama kila mbele inapaswa kuwa.

Tutaona misingi ya kuunda App ambayo itaonekana kama Mfano 4 umeonyeshwa.

Tuanze !

PS: Ikiwa unapenda mradi huu, unaweza kunipigia kura katika Mashindano ya Sayansi ya Darasa. Shukrani sana !!

PS2: Baadhi ya makosa ya Kiingereza yatafanywa, nisamehe:)

Hatua ya 2: BackGround

Nimefanya uundaji zaidi juu ya Figma, programu ya bure ya vector, kama rangi ya hali ya juu, ambayo hukuruhusu kuunda maumbo na rangi kwa urahisi: Ni angavu sana, naipendekeza: www.figma.com!

Huna haja ya kutumia Figma mbele yako, lakini napenda kutengeneza muundo kabla ya kuunda programu yenyewe.

Kama unavyoona kwenye picha, mandharinyuma inahitaji kuwa laini sana, kwani tutaweka vitufe, picha, n.k … juu yake…

Ninapendekeza uwazi wa 30% kwenye rangi unayotumia, na msingi na rangi 1 tu.

Hatua ya 3: Rangi

Rangi unazochagua na ukali wake ni muhimu sana katika App.

Ushauri wa kwanza ambao ninatoa ni kuchagua upeo wa rangi 3 (+ nyeusi na nyeupe): bado tunajaribu kuwa laini:)

Kwa mfano 4 ambao nimefanya, hapa kuna ushauri ambao nimechagua (unaweza pia kuwaona kwenye picha, kama kumbukumbu):

Asili: asili laini na nyepesi isiyo na umbo (30% ya uwazi wa rangi). Kumbuka rangi hii kujumuisha vifungo vyako!

Kichwa: Nakala nyembamba katika rangi nyeusi ya kijivu inaonekana nzuri! Kwa kichwa kidogo na maandishi yafuatayo, kaa nyeusi, lakini badilisha kivuli cha rangi nyeusi (kijivu wakati sio habari kubwa), na ucheze na saizi na sifa ambayo unaweza (ujasiri, italiki).

Kitufe: Rangi moja, kwa jumla rangi yako ya asili na (80-100% ya uwazi), kisha nyeusi au nyeupe kuimaliza.

Slider: usitumie rangi 2 kwao, rangi moja tu upande wa kushoto, na upande wa kulia katika kivuli cha nyeusi.

Ni hayo tu !!

Chini ni zaidi !!!! Usitumie rangi nyingi, sura na saizi, Kuwa mjanja!

Hatua ya 4: Weka Kigezo sahihi cha Skrini

Kwenye skrini kuu ya sehemu ya Mbuni wa Mvumbuzi wa Programu, unaweza kuchagua tabia kuu ya skrini.

Kwenye Screen1 -> Mali, fuata hatua ifuatayo kufuta fremu ya nyongeza kutoka kwa AI2 ambayo haionekani kuwa nzuri ^ _ ^.

1 - Mwelekeo wa skrini

Chagua mwelekeo mmoja tu kwa sababu programu haibadiliki vizuri unapoigeuza.

Nilichagua mwelekeo wa Picha.

2 - Lemaza 'Kichwa kinachoonekana' na 3- Lemaza 'ShowStatusBar'

Ninazima kichwa na upau wa hali, kwa sababu inaongeza baa kwenye programu, ambayo sio ya kupendeza (kwa maoni yangu).

4 - Kipimo

Kipimo cha programu ya kawaida ni 505x320 (urefu x upana). Kumbuka hizo mwelekeo wa kuunda usuli na picha zako (angalau uwe na idadi sawa)! Ikiwa unatumia Figma, unaweza kuunda saizi sahihi ya programu yako papo hapo.

5 - Ukubwa

Ikiwa utachagua Zisizohamishika, basi programu itakuwa na ukubwa wa 505x320. Ukichagua Msikivu, basi programu itatoshea smartphone yako, lakini tahadhari, itabidi ubadilishe picha zako.

Hatua ya 5: Jinsi ya kuifanya:)

Ili kuzaa mfano wa kwanza, tutafuata hatua 3 (kama picha):

1 - Chukua vipimo

Kilicho nzuri kwenye figma ni kwamba unaweza kuona saizi ya muafaka wako na kitu, kwa hivyo unaweza kuona ni ukubwa gani utakuwa vitu vyako, na tupu! Tupu ni muhimu sana kwa Mvumbuzi wa App kwa sababu tutaiunda kwa kuweka lebo isiyoonekana!

2 - Jaza vitupu vitupu vitambulisho

Kama unavyoona kwenye picha ya pili, tunazaa mbele ambayo tunataka kwa kuweka lebo yenye saizi inayofaa. Kisha ifanye ionekane kuwa haionekani (bonyeza kitufe 'kinachoonekana').

Tumia pia Mpangilio -> Mpangilio wa kuweka vitu vyako

3 - Jaribu kuunda vifungo vyako kwenye programu

Ikiwezekana, tengeneza vifungo vyako kwenye wavuti ya AI2, zitakuwa katika hali ya juu na uhuishaji mdogo 'kwenye bonyeza' utakuwa mzuri:). Wakati huwezi kutengeneza vifungo vyako mwenyewe, unaweza kuziunda kwenye programu nyingine, na kisha uiingize kama picha.

Hatua ya 6: Matokeo:)

Kushoto: picha ya skrini kutoka kwa smartphone yangu kwenye AI2.

Kulia: rasimu iliyotengenezwa kwa Figma.

Natumai kweli hii inayoweza kufundishwa itakusaidia kujenga programu nzuri kwenye AI2.

Asante sana kwa kutazama. Ikiwa unahitaji ushauri zaidi tafadhali nijulishe…

Mwingine anayefundishwa juu ya nyuma ya AI2 atatolewa hivi karibuni!

Wako kwa Heshima, Thomas, kutoka Technofabrique