NativeScript - โมดูล
NativeScript โมดูลมีชุดของฟังก์ชันการทำงานที่เกี่ยวข้องกับการบรรจุเป็นห้องสมุดเดียว ให้เราเรียนรู้โมดูลที่จัดทำโดย NativeScript framework
ประกอบด้วยฟังก์ชันหลักของกรอบงาน NativeScript ให้เราเข้าใจโมดูลหลักในบทนี้
ใบสมัคร
แอปพลิเคชันประกอบด้วยการใช้งานแอปพลิเคชันมือถือเฉพาะแพลตฟอร์ม โมดูลหลักอย่างง่ายถูกกำหนดไว้ด้านล่าง -
const applicationModule = require("tns-core-modules/application");
คอนโซล
โมดูลคอนโซลใช้เพื่อบันทึกข้อความ มีวิธีการดังต่อไปนี้ -
console.log("My FirstApp project");
console.info("Native apps!");
console.warn("Warning message!");
console.error("Exception occurred");
การตั้งค่าแอปพลิเคชัน
โมดูลการตั้งค่าแอปพลิเคชันประกอบด้วยวิธีการจัดการการตั้งค่าแอปพลิเคชัน ในการเพิ่มโมดูลนี้เราต้องเพิ่มรหัสต่อไปนี้ -
const appSettings = require("tns-core-modules/application-settings");
วิธีการไม่กี่วิธีที่สามารถใช้ได้ในการตั้งค่าแอปพลิเคชันมีดังนี้ -
setBoolean (คีย์: สตริง, ค่า: บูลีน) - ตั้งค่าวัตถุบูลีน
setNumber (คีย์: สตริงค่า: ตัวเลข) - ตั้งค่าอ็อบเจ็กต์ตัวเลข
setString (คีย์: สตริง, ค่า: สตริง) - ตั้งค่าวัตถุสตริง
getAllKeys () - มีคีย์ที่เก็บไว้ทั้งหมด
hasKey (คีย์: สตริง) - ตรวจสอบว่ามีคีย์อยู่หรือไม่
ชัดเจน - ล้างค่าที่เก็บไว้
ลบ - ลบรายการใด ๆ ตามคีย์
ตัวอย่างง่ายๆโดยใช้การตั้งค่าแอปพลิเคชันมีดังนี้ -
function onNavigatingTo(args) {
appSettings.setBoolean("isTurnedOff", false);
appSettings.setString("name", "nativescript");
appSettings.setNumber("locationX", 54.321);
const isTurnedOn = appSettings.getBoolean("isTurnedOn");
const username = appSettings.getString("username");
const locationX = appSettings.getNumber("locationX");
// Will return "not present" if there is no value for "noKey"
const someKey = appSettings.getString("noKey", "not present");
}
exports.onNavigatingTo = onNavigatingTo;
function onClear() {
// Removing a single entry via its key name
appSettings.remove("isTurnedOff");
// Clearing the whole settings
appSettings.clear();
}
http
โมดูลนี้ใช้สำหรับการจัดการ httpคำขอและการตอบสนอง ในการเพิ่มโมดูลนี้ในแอปพลิเคชันของคุณให้เพิ่มรหัสต่อไปนี้ -
const httpModule = require("tns-core-modules/http");
เราสามารถส่งข้อมูลโดยใช้วิธีการดังต่อไปนี้ -
getString- ใช้ในการร้องขอและดาวน์โหลดข้อมูลจาก URL เป็นสตริง มีการกำหนดไว้ด้านล่าง -
httpModule.getString("https://.../get").then(
(r) => {
viewModel.set("getStringResult", r);
}, (e) =>
{
}
);
getJSON- ใช้เพื่อเข้าถึงข้อมูลจาก JSON มีการกำหนดไว้ด้านล่าง -
httpModule.getJSON("https://.../get").then((r) => {
}, (e) => {
});
getImage- ดาวน์โหลดเนื้อหาจาก URL ที่ระบุและส่งคืนออบเจ็กต์ ImageSource มีการกำหนดไว้ด้านล่าง -
httpModule.getImage("https://.../image/jpeg").then((r) => {
}, (e) => {
});
getFile - มี URL อาร์กิวเมนต์สองรายการและเส้นทางไฟล์
URL - ดาวน์โหลดข้อมูล
File path- บันทึกข้อมูล URL ลงในไฟล์ มีการกำหนดไว้ด้านล่าง -
httpModule.getFile("https://").then((resultFile) => {
}, (e) => {
});
request- มีอาร์กิวเมนต์ตัวเลือก ใช้เพื่อร้องขออ็อพชันและส่งคืนอ็อบเจ็กต์ HttpResponse มีการกำหนดไว้ด้านล่าง -
httpModule.request({
url: "https://.../get",
method: "GET"
}).then((response) => {
}, (e) => {
});
แหล่งที่มาของภาพ
โมดูลแหล่งที่มาของภาพใช้บันทึกภาพ เราสามารถเพิ่มโมดูลนี้ได้โดยใช้คำสั่งด้านล่าง -
const imageSourceModule = require("tns-core-modules/image-source");
หากคุณต้องการโหลดภาพจากทรัพยากรให้ใช้รหัสด้านล่าง -
const imgFromResources = imageSourceModule.fromResource("icon");
ในการเพิ่มรูปภาพจากไฟล์ในเครื่องให้ใช้คำสั่งด้านล่าง -
const folder = fileSystemModule.knownFolders.currentApp();
const path = fileSystemModule.path.join(folder.path, "images/sample.png");
const imageFromLocalFile = imageSourceModule.fromFile(path);
ในการบันทึกภาพไปยังเส้นทางไฟล์ให้ใช้คำสั่งด้านล่าง -
const img = imageSourceModule.fromFile(imagePath);
const folderDest = fileSystemModule.knownFolders.documents();
const pathDest = fileSystemModule.path.join(folderDest.path, "sample.png");
const saved = img.saveToFile(pathDest, "png"); if (saved) {
console.log(" sample image saved successfully!");
}
จับเวลา
โมดูลนี้ใช้ในการรันโค้ดในช่วงเวลาที่กำหนด ในการเพิ่มสิ่งนี้เราจำเป็นต้องใช้require -
const timerModule = require("tns-core-modules/timer");
มันขึ้นอยู่กับสองวิธี -
setTimeout- ใช้เพื่อชะลอการดำเนินการ มันแสดงเป็นมิลลิวินาที
setInterval - ใช้เพื่อใช้เป็นประจำในช่วงเวลาที่กำหนด
ติดตาม
โมดูลนี้มีประโยชน์สำหรับการดีบัก ให้ข้อมูลการบันทึก โมดูลนี้สามารถแสดงเป็น -
const traceModule = require("tns-core-modules/trace");
หากคุณต้องการเปิดใช้งานในแอปพลิเคชันของคุณให้ใช้คำสั่งด้านล่าง -
traceModule.enable();
ui / รูปภาพแคช
โมดูลแคชรูปภาพใช้เพื่อจัดการคำขอดาวน์โหลดรูปภาพและแคชรูปภาพที่ดาวน์โหลด โมดูลนี้สามารถแสดงได้ดังที่แสดงด้านล่าง -
const Cache = require("tns-core-modules/ui/image-cache").Cache;
การเชื่อมต่อ
โมดูลนี้ใช้เพื่อรับข้อมูลการเชื่อมต่อของเครือข่ายที่เชื่อมต่อ สามารถแสดงเป็น -
const connectivityModule = require("tns-core-modules/connectivity");
โมดูลการทำงาน
โมดูลฟังก์ชันการทำงานประกอบด้วยโมดูลเฉพาะระบบ / แพลตฟอร์มจำนวนมาก โมดูลที่สำคัญบางส่วนมีดังนี้ -
platform- ใช้เพื่อแสดงข้อมูลเกี่ยวกับอุปกรณ์ของคุณ สามารถกำหนดได้ตามที่ระบุด้านล่าง -
const platformModule = require("tns-core-modules/platform");
fps-meter- ใช้เพื่อจับภาพเฟรมต่อวินาที สามารถกำหนดได้ตามที่ระบุด้านล่าง -
const fpsMeter = require("tns-core-modules/fps-meter");
file-system- ใช้เพื่อทำงานกับระบบไฟล์อุปกรณ์ของคุณ มีการกำหนดไว้ด้านล่าง -
const fileSystemModule = require("tns-core-modules/file-system");
ui/gestures - ใช้เพื่อทำงานกับท่าทาง UI
โมดูล UI
โมดูล UI ประกอบด้วยส่วนประกอบ UI และฟังก์ชันที่เกี่ยวข้อง โมดูล UI ที่สำคัญบางส่วนมีดังนี้ -
frame
page
color
text/formatted-string
xml
styling
animation