APP INVENTOR 2 - Урд талын цэвэр зөвлөмж (+4 жишээ): 6 алхам

2024 Зохиолч: John Day | [email protected]. Хамгийн сүүлд өөрчлөгдсөн: 2024-01-30 11:02

Бид AI2 дээрх апп -аа хэрхэн гоо үзэсгэлэнтэй харагдуулахыг харах болно.:)

Энэ удаад ямар ч код байхгүй, зөвхөн дээр дурдсан 4 жишээ шиг гөлгөр програмын талаархи зөвлөмжүүд!

Хангамж

Алхам 1: Танилцуулга

Энэхүү зааварчилгаа нь MIT -ийн боловсруулсан App Inventor 2 програмыг сурч байгаа эсвэл ашигладаг бүх хүмүүст зориулагдсан болно.

MIT AI2 бол үнэгүй, энгийн бөгөөд гайхалтай ухаалаг гар утасны аппликейшн бөгөөд DIY Arduino эсвэл электрон төхөөрөмж бүрт тохиромжтой. Гэхдээ түүний энгийн байдал нь түүнийг нэлээд хязгаарлагдмал болгодог, ялангуяа та апп -аа гоо үзэсгэлэнтэй харагдуулахыг хичээдэг.

Энэхүү зааварчилгааны зорилго нь таны ирээдүйн аппликейшны гайхалтай фронтыг бий болгоход туслах хэдэн зөвлөмжийг өгөх явдал юм.

Бид 4 жишээг үзүүлсэн шиг харагдах Апп бүтээх үндсийг харах болно.

Эхэлцгээе !

Жич: Хэрэв танд энэ төсөл таалагдаж байвал танхимын шинжлэх ухааны уралдаанд надад саналаа өгөх боломжтой. Танд маш их баярлалаа !!

PS2: Англи хэлний зарим алдаа гарах болно, намайг уучлаарай:)

Алхам 2: Background

Би Figma -ийн нэмэлт бүтээлийг боловсруулсан бөгөөд энэ нь дүрс, өнгийг хялбархан гаргах боломжийг олгодог дэвшилтэт будаг шиг үнэгүй програм хангамж юм: Энэ нь маш ойлгомжтой, үүнийг танд зөвлөж байна: www.figma.com!

Та урд талдаа Figma ашиглах шаардлагагүй, гэхдээ би өөрөө програмыг бүтээхээсээ өмнө дизайн хийх дуртай.

Зурган дээр харж байгаа шиг дэвсгэр нь маш зөөлөн байх ёстой, учир нь бид зарим товчлуур, зураг гэх мэтийг байрлуулах гэж байна …

Би таны хэрэглэж буй өнгөний 30% тунгалаг байдал, зөвхөн 1 өнгөтэй дэвсгэртэй байхыг зөвлөж байна.

Алхам 3: Өнгө

Аппликешнд таны сонгосон өнгө, тэдгээрийн эрч хүч маш чухал байдаг.

Миний өгөх хамгийн эхний зөвлөгөө бол хамгийн ихдээ 3 өнгийг (+ хар ба цагаан) сонгох явдал юм: бид зөөлөн байхыг хичээдэг:)

Миний хийсэн 4 жишээний хувьд миний сонгосон зөвлөгөөг энд оруулав (та тэдгээрийг зурган дээрээс тойм болгон харж болно):

Арын дэвсгэр: зөөлөн, цайвар дэвсгэр, хэлбэр дүрсгүй (өнгөний тунгалаг байдал 30%). Товчлууруудаа нэгтгэхийн тулд энэ өнгийг санаарай!

Гарчиг: Хар саарал өнгийн нимгэн текст сайн харагдаж байна! Дараах хадмал болон текстийн хувьд хар өнгөтэй байгаарай, гэхдээ хар өнгийн сүүдрийг өөрчил (том мэдээлэл биш байхад саарал өнгөтэй), өөрийн чадах хэмжээ, шинж чанараараа тоглоорой (тод, налуу).

Товч: Нэг өнгө, ерөнхийдөө таны арын өнгө (80-100% тунгалаг), дараа нь хар эсвэл цагаан өнгөтэй болгож дуусгах боломжтой.

Слайдерууд: тэдэнд зориулж 2 өнгө бүү ашигла, зөвхөн нэг өнгө зүүн талд, баруун тал нь хар сүүдэртэй.

Ингээд л боллоо !!

Бага нь илүү !!!! Өнгө, хэлбэр, хэмжээг хэт их бүү ашигла, нарийн болго!

Алхам 4: Дэлгэцийн зөв параметрийг тохируулна уу

App Inventor Designer хэсгийн үндсэн дэлгэц дээр та дэлгэцийн үндсэн шинж чанарыг сонгох боломжтой.

Screen1 -> Properties дээр AI2 -оос тийм ч сайн харагдахгүй нэмэлт фрэймийг устгахын тулд дараах үйлдлийг хийнэ үү ^_ ^.

1 - Дэлгэцийн чиглэл

Аппликешныг эргүүлэхэд тийм ч сайн дасан зохицдоггүй тул зөвхөн нэг чиглэлийг сонгоорой.

Би хөрөг зургийн чиглэлийг сонгосон.

2 - 'Title Visible' болон 3 - ShowStatusBar -ийг идэвхгүй болгох

Би гарчиг болон статусын мөрийг идэвхгүй болгодог, учир нь энэ нь аппликейшнд тийм ч гоо зүйн бус мөрүүдийг нэмж өгдөг (миний бодлоор).

4 - Хэмжээ

Нийтлэг програмын хэмжээ нь 505x320 (өндөр x өргөн). Өөрийн дэвсгэр зураг, зургийг бүтээхийн тулд эдгээр хэмжээсийг санаарай (дор хаяж ижил хувьтай байх ёстой)! Хэрэв та Figma -г ашигладаг бол та өөрийн аппликешны хэмжээг шууд бий болгож чадна.

5 - Хэмжээ

Хэрэв та Fixed -ийг сонговол програм нь 505x320 хэмжээтэй байх болно. Хэрэв та Responsive -ийг сонговол уг програм нь таны ухаалаг гар утсанд тохирох болно, гэхдээ та зургуудаа дасан зохицох хэрэгтэй болно.

Алхам 5: Үүнийг яаж хийх вэ:)

Эхний жишээг хуулбарлахын тулд бид 3 алхамыг хийх болно (зураг шиг):

1 - Хэмжээ авах

Фигма дээрх гайхалтай зүйл бол та хүрээ, объектынхаа хэмжээг харж чаддаг тул таны объект, хоосон зай ямар хэмжээтэй болохыг харах боломжтой болно! App Inventor дээр хоосон зай маш чухал байдаг, учир нь бид тэдгээрийг үл үзэгдэгч шошго ашиглан бүтээх болно!

2 - Хоосон нүдэнд үл үзэгдэх шошгыг бөглөнө үү

Хоёрдахь зурган дээр харж байгаа шиг бид хүссэн хэмжээгээ тохируулан шошго байрлуулж хүссэн нүүрээ хуулбарлаж байна. Дараа нь үүнийг үл үзэгдэх харагдуулна ("харагдах" товчийг дарна уу).

Мөн Layout -> Arrangement ашиглан эд зүйлсээ байрлуулна уу

3 - Програм хангамж дээр өөрийн товчлууруудыг үүсгэхийг хичээгээрэй

Боломжтой бол AI2 вэбсайт дээр товчлууруудаа бүтээгээрэй, энэ нь өндөр чанартай байх болно, жижиг товчлуур дээр дарахад үнэхээр гайхалтай байх болно:). Хэрэв та товчлуурыг өөрөө хийх боломжгүй бол тэдгээрийг өөр програм дээр үүсгэж, дараа нь дүрс болгон импортлох боломжтой.

Алхам 6: Үр дүн:)

Зүүн талд: AI2 дээрх ухаалаг гар утасныхаа дэлгэцийн агшин.

Баруун талд: Фигма дээр хийсэн төсөл.

Энэхүү зааварчилгаа нь танд AI2 дээр гайхалтай програм бүтээхэд тусална гэж найдаж байна.

Үзсэн танд маш их баярлалаа. Хэрэв танд нэмэлт зөвлөгөө хэрэгтэй бол надад мэдэгдээрэй …

AI2 -ийн арын хэсэгт өөр нэг зааварчилгаа удахгүй гарах болно!

Хүндэтгэсэн, Томас, Technofabrique -ээс