Nativescript Template

https://leevikopakkala.github.io/nativescript-template/

NativeScript-Angular พร้อม SidedRawer และ Tabview

นี่คือเทมเพลตที่ดีที่สุดพร้อมโครงสร้างที่ได้รับการปรับปรุงเพื่อช่วยให้คุณเปิดแอพหรือโครงการลูกค้าแรกของคุณในเวลาไม่เวลา

ภาพรวม

เราทุกคนรู้ว่ากระบวนการที่ช้าในการตั้งค่าโครงการและการสร้างฐานการทำงานก่อนที่จะสามารถเพิ่มคุณสมบัติได้ ด้วยเทมเพลตนี้คุณจะได้รับแอปพลิเคชันที่ทำงานได้อย่างสมบูรณ์นอกกรอบด้วย SidedRrawer และ TabView

เหมาะสำหรับผู้เริ่มต้นและมืออาชีพเหมือนกัน

การใช้แนวทางปฏิบัติที่ดีที่สุดพัฒนาแอปพลิเคชั่นมือถือจริงตัวแรกของคุณในเวลาไม่เวลา

เทมเพลต NativeScript ประกอบด้วย NativeScript SidedRawer และ Tabview ส่วนประกอบ:

การอ้างอิงถึงปลั๊กอินแต่ละตัวที่ใช้ในเทมเพลตนี้:

• https://market.nativescript.org/plugins/tns-template-drawer-navigation-ng
• https://market.nativescript.org/plugins/tns-template-lrank-ng
• https://market.nativescript.org/plugins/tns-template-tab-navigation-ng

การติดตั้ง:

เร็ว:

1. ติดตั้ง node.js https://nodejs.org/

2. ติดตั้ง NativeScript CLI npm install -g nativescript

3. ตรวจสอบว่า Nativescript CLI กำลังทำงาน tns

4. ติดตั้ง Android Studio (หรือ iOS เทียบเท่า) https://developer.android.com/studio/

• 4.1 Open Android Studio -> AVD Manager -> สร้าง Emulator

5. (เสริม แต่มีประโยชน์) ติดตั้ง https://www.nativescript.org/nativescript-sidekick

วิ่ง:

1. git clone https://github.com/LeeviKopakkala/Nativescript-Template

2. cd Nativescript-Template

3. tns device android --available-devices หรือ tns device ios --available-devices

4. tns run android / tns run android --device {device name} หรือ tns run ios / `TNS เรียกใช้ iOS -Device {ชื่ออุปกรณ์}

หากใช้เพื่อนสนิท

4. เพื่อนสนิทเปิด

• 4.1 เพิ่มโครงการ

• 4.2 เลือก emulator

• 4.3 วิ่ง

สถาปัตยกรรม

ส่วนประกอบ radsidedRrawer ถูกตั้งค่าเป็นจุดเริ่มต้นของแอปพลิเคชันใน:

• /app-component.ts - ตั้งค่าเนื้อหาลิ้นชักด้านข้างและกำหนดเต้าเสียบเราเตอร์หน้าสำหรับหน้า

RadsidedRrawer มีโครงสร้างส่วนประกอบดังต่อไปนี้:

• RadSideDrawer - ส่วนประกอบที่จะแสดงลิ้นชักบนหน้า
• tkDrawerContent Directive - ทำเครื่องหมายส่วนประกอบที่จะเก็บเนื้อหาลิ้นชัก
• tkMainContent Directive - ทำเครื่องหมายส่วนประกอบที่จะเก็บเนื้อหาหลักของแอพ

มีส่วนประกอบว่างเปล่าห้ารายการในโฟลเดอร์เหล่านี้:

• /browse
• /featured
• /home
• /search
• /settings

การจัดแต่งทรงผม

เทมเพลตนี้ถูกตั้งค่าให้ใช้ SASS สำหรับการจัดแต่งทรงผม คลาสทั้งหมดที่ใช้ขึ้นอยู่กับธีม {n} หลัก - ปรึกษาเอกสารเพื่อทำความเข้าใจวิธีการปรับแต่ง ตรวจสอบเพื่อดูว่าคุณสามารถใช้คลาสใดกับส่วนประกอบใด

มีไฟล์สไตล์ทั่วโลก 4 ไฟล์ที่อยู่ที่รูทของโฟลเดอร์แอพ:

• _app-variables.scss - ถือตัวแปร SASS ทั่วโลกที่นำเข้าในรูปแบบของแต่ละองค์ประกอบ
• _app-common.scss - แผ่นสไตล์สามัญระดับโลก กฎสไตล์เหล่านี้ใช้กับทั้ง Android และ iOS
• app.android.scss - แผ่นสไตล์ Android ระดับโลก กฎสไตล์เหล่านี้ใช้กับ Android เท่านั้น
• app.ios.scss - แผ่นสไตล์ iOS ทั่วโลก กฎสไตล์เหล่านี้ใช้กับ iOS เท่านั้น