تخصيص واجهة مستخدم Azure IoT المركزية
توضح هذه المقالة كيفية تخصيص واجهة المستخدم الخاصة بالتطبيق الخاص بك عن طريق تطبيق نسق مخصصة وتغيير النص وتعديل ارتباطات التعليمات للإشارة إلى موارد التعليمات المخصصة الخاصة بك.
تعرض لقطة الشاشة التالية صفحة تستخدم النسق القياسي:

تعرض لقطة الشاشة التالية صفحة تستخدم لقطة شاشة مخصصة مع تمييز عناصر واجهة المستخدم المخصصة:

إنشاء نسق
لإنشاء نسق مخصص، انتقل إلى قسم المظهر في صفحة التخصيص .

في هذه الصفحة، يمكنك تخصيص الجوانب التالية من التطبيق الخاص بك:
شعار التطبيق
صورة PNG ، لا يزيد حجمها عن 1 ميغابايت ، مع خلفية شفافة. يتم عرض هذا الشعار على اليسار على شريط عنوان تطبيق IoT Central.
إذا كانت صورة شعارك تتضمن اسم التطبيق الخاص بك، فيمكنك إخفاء نص اسم التطبيق. لمزيد من المعلومات، راجع إدارة التطبيق.
أيقونة المتصفح (favicon)
صورة PNG ، لا يزيد حجمها عن 32 × 32 بكسل ، مع خلفية شفافة. يمكن لمتصفح الويب استخدام هذه الصورة في شريط العناوين والسجل والإشارات المرجعية وعلامة تبويب المتصفح.
ألوان المتصفح
يمكنك تغيير لون رأس الصفحة واللون المستخدم لتمييز الأزرار والإبرازات الأخرى. استخدم قيمة لون سداسي عشري ستة أحرف في التنسيق ##ff6347. لمزيد من المعلومات حول تدوين الألوان HEX Value، راجع ألوان HTML.
ملاحظة
يمكنك دائما العودة إلى الخيارات الافتراضية في قسم المظهر .
التغييرات للمشغلين
إذا قام أحد المسؤولين بإنشاء نسق مخصص، فلن يتمكن المشغلون والمستخدمون الآخرون للتطبيق من اختيار نسق في المظهر.
استبدال ارتباطات التعليمات
لتوفير معلومات تعليمات مخصصة للمشغلين والمستخدمين الآخرين، يمكنك تعديل الارتباطات الموجودة في قائمة تعليمات التطبيق.
لتعديل ارتباطات التعليمات، انتقل إلى قسم ارتباطات التعليمات في صفحة التخصيص .

يمكنك أيضا إضافة إدخالات جديدة إلى قائمة التعليمات وإزالة الإدخالات الافتراضية:

ملاحظة
يمكنك دائما العودة إلى ارتباطات التعليمات الافتراضية في صفحة التخصيص .
تغيير نص التطبيق
لتغيير التسميات النصية في التطبيق، انتقل إلى قسم النص في صفحة التخصيص .
في هذه الصفحة، يمكنك تخصيص نص التطبيق الخاص بك لجميع اللغات المدعومة. يمكنك تغيير النص المتعلق ب "الجهاز" إلى أي كلمة تفضلها باستخدام ملف تخصيص النص. بعد تحميل الملف، يظهر نص التطبيق تلقائيا مع الكلمات المحدثة. يمكنك إجراء المزيد من التخصيصات عن طريق تحرير ملف التخصيص والكتابة فوقه. يمكنك تكرار العملية لأي لغة تدعمها واجهة مستخدم IoT Central.
يوضح المثال التالي كيفية تغيير الكلمة Device إلى Asset عند عرض التطبيق باللغة الإنجليزية:
حدد إضافة نص تطبيق وحدد اللغة الإنجليزية في القائمة المنسدلة.
قم بتنزيل الملف النصي الافتراضي. يحتوي الملف على تعريف JSON للسلاسل النصية التي يمكنك تغييرها.
افتح الملف في محرر نصوص وقم بتحرير سلاسل الجانب الأيسر لاستبدال الكلمة
deviceكماassetهو موضح في المثال التالي:{ "Device": { "AllEntities": "All assets", "Approve": { "Confirmation": "Are you sure you want to approve this asset?", "Confirmation_plural": "Are you sure you want to approve these assets?" }, "Block": { "Confirmation": "Are you sure you want to block this asset?", "Confirmation_plural": "Are you sure you want to block these assets?" }, "ConnectionStatus": { "Connected": "Connected", "ConnectedAt": "Connected {{lastReportedTime}}", "Disconnected": "Disconnected", "DisconnectedAt": "Disconnected {{lastReportedTime}}" }, "Create": { "Description": "Create a new asset with the given settings", "ID_HelpText": "Enter a unique identifier this asset will use to connect.", "Instructions": "To create a new asset, select an asset template, a name, and a unique ID. <1>Learn more <1></1></1>", "Name_HelpText": "Enter a user friendly name for this asset. If not specified, this will be the same as the asset ID.", "Simulated_Label": "Simulate this asset?", "Simulated_HelpText": "A simulated asset generates telemetry that enables you to test the behavior of your application before you connect a real asset.", "Title": "Create a new asset", "Unassigned_HelpText": "Choosing this will not assign the new asset to any asset template.", "HardwareId_Label": "Hardware type", "HardwareId_HelpText": "Optionally specify the manufacturer of the asset", "MiddlewareId_Label": "Connectivity solution", "MiddlewareId_HelpText": "Optionally choose what type of connectivity solution is installed on the asset" }, "Delete": { "Confirmation": "Are you sure you want to delete this asset?", "Confirmation_plural": "Are you sure you want to delete these assets?", "Title": "Delete asset permanently?", "Title_plural": "Delete assets permanently?" }, "Entity": "Asset", "Entity_plural": "Assets", "Import": { "Title": "Import assets from a file", "HelpText": "Choose the organization that can access the assets you’re importing, and then choose the file you’ll use to import. <1>Learn more <1></1></1>", "Action": "Import assets with an org assignment from a chosen file.", "Upload_Action": "Upload a .csv file", "Browse_HelpText": "You’ll use a CSV file to import assets. Click “Learn more” for samples and formatting guidelines." }, "JoinToGateway": "Attach to gateway", "List": { "Description": "Grid displaying list of assets", "Empty": { "Text": "Assets will send data to IoT Central for you to monitor, store, and analyze. <1>Learn more <1></1></1>", "Title": "Create an Asset" } }, "Migrate": { "Confirmation": "Migrating selected asset to another template. Select migration target.", "Confirmation_plural": "Migrating selected assets to another template. Select migration target." }, "Properties": { "Definition": "Asset template", "DefinitionId": "Asset template ID", "Id": "Asset ID", "Name": "Asset name", "Scope": "Organization", "Simulated": "Simulated", "Status": "Asset status" }, "Rename": "Rename asset", "Status": { "Blocked": "Blocked", "Provisioned": "Provisioned", "Registered": "Registered", "Unassociated": "Unassociated", "WaitingForApproval": "Waiting for approval" }, "SystemAreas": { "Downstreamassets": "Downstream assets", "Module_plural": "Modules", "Properties": "Properties", "RawData": "Raw data" }, "TemplateList": { "Empty": "No definitions found.", "FilterInstructions": "Filter templates" }, "Unassigned": "Unassigned", "Unblock": { "Confirmation": "Are you sure you want to unblock this asset?", "Confirmation_plural": "Are you sure you want to unblock these assets?" } } }Upload ملف التخصيص الذي تم تحريره وحدد حفظ لرؤية النص الجديد في التطبيق:
تستخدم واجهة المستخدم الآن القيم النصية الجديدة:
يمكنك إعادة تحميل ملف التخصيص مع إجراء مزيد من التغييرات عن طريق تحديد اللغة ذات الصلة من القائمة في قسم النص في صفحة التخصيص .
الخطوات التالية
الآن بعد أن تعلمت كيفية تخصيص واجهة المستخدم في تطبيق IoT Central الخاص بك ، إليك بعض الخطوات التالية المقترحة: