کیو-ام-ال

کیو-ام-ال یک زبان بر پایه جاوااسکریپت و برنامه‌نویسی اعلانی برای ایجاد واسط‌های کاربری برای برنامه‌های کاربردی است. این زبان بخشی از پروژه Qt Quick (کیت UI توسعه یافته به وسیله شرکت نوکیا) می‌باشد. کیو-ام-ال به طور عمده برای نرم‌افزارهای موبایل استفاده می‌شود. کیو-ام-ال بر سه‌پایه استوار است. کیوت به عنوان حامل، اشیاء (مستطیل، دایره، مثلث، عکس و …) و رفتارها (حالت‌ها،انتقال‌ها، انیمیشن‌ها).
این المان‌ها می‌توانند برای ساخت قطعات پیچیده از قطعات ساده مانند کلیدها و لغزنده‌ها به منظور استفاده در برنامه‌های کاربردی و قابل دسترس از طریق اینترنت استفاده شود. این المان‌ها همچنین می‌توانند با استفاده درون برنامه‌ای از برنامه‌نویسی جاوا اسکریپت و همچنین فریم ورک کیوت بر پایه زبان برنامه‌نویسی سی پلاس پلاس توسعه پیدا کند.
ساختاری، معنایی
ساختار اصلی
مثال:
import QtQuick 1.0
Rectangle {
id: canvas
width: 200
height: 200
color: "blue"
Image {
id: logo
source: "pics/logo.png"
anchors.centerIn: parent
x: canvas.height / 5
اشیاء به وسیله نوعشان (مثلث، مربع…)متمایز می‌شوند که به دنبال آن یک جفت کروشه می‌آید، نام اشیاء با یک حرف بزرگ شروع می‌شود. در مثال بالا، دو شیء وجود دارد، یک مستطیل و فرزند آن که یک عکس می‌باشد. در میان کروشه‌ها، شما می‌توانید اطلاعاتی (مثلا خصوصیات آن شیء) را به اشیاء نسبت دهید. خصوصیات یک شیء به صورت مقدار:خصوصیت تعریف می‌شود. در مثال بالا می‌توان دید که شیء Image دارای یک خصوصیت به نام source می‌باشد که مقدار "pics/logo.png" به آن نسبت داده شده. خصوصیت و مقدار آن به وسیله یک علامت دونقطه از هم جدا می‌شود.
خصوصیت id
هر شیء می‌تواند یک خصوصیت ویژه و یکتا داشته باشد که به آن id گفته می‌شود. نسبت دادن id به اشیاء این امکان را فراهم می‌آورد که یک شیء به یک شیء دیگر ارجاع پیدا کند. در مثال زیر به مستطیل اول یک id به نام "myRect" نسبت داده شده، و در مستطیل دوم خصوصیت width (عرض) به مستطیل اول ارجاع داده شده، به این صورت که مقدار width در مستطیل اول به پارامتر width در مستطیل دوم نیز نسبت داده می‌شود.
Item {
Rectangle {
id: myRect
width: 100
height: 100
Rectangle {
width: myRect.width
height: 200
نام مقدار نسبت داده شده به خصوصیت id باید با حروف کوچک یا یک علامت شروع شود، و همچنین نمی‌تواند در ادامه به چز حروف انگلیسی کاراکتر دیگری (مثل اعداد یا علائم) را شامل شود.
شیرازه خصوصیت
یک شیرازه خصوصیت مقدار یک خصوصیت را در حالتی اعلانی مشخص می‌کند. اگر دیگر خصوصیت‌ها یا دیگر مقدارها تغییر کنند. خصوصیت‌ها به صورت خودکار به روز می‌شوند.
شیرازه خصوصیت به صورت ضمنی در کیو-ام-ال برای زمانهایی ساخته شده‌است که یک خصوصیت به یک عبارت جاوا اسکریپتی نسبت داده می‌شود. کد کیو-ام-ال زیر از دو شیرازه خصوصیت برای ایجاد ارتباط بین اندازه مستطیل و "otherItem" استفاده کرده‌است.
Rectangle {
width: otherItem.width
height: otherItem.height
کیو-ام-ال یک کامپایلر استاندارد جاوا اسکریپت را شامل می‌شود، بنابراین هر عبارت معتبر در جاوا اسکریپت می‌تواند به عنوان یک شیرازه خصوصیت استفاده شود. شیرازه‌ها می‌توانند به خصوصیات اشیاء دسترسی داشته باشند، توابع را فراخوانی کنند، و حتی از اشیاء تو کار جاوا اسکریپت مانند Math و Date نیز استفاده کنند.
مثال:
Rectangle {
function calculateMyHeight() {
return Math.max(otherItem.height, thirdItem.height);
anchors.centerIn: parent
width: Math.min(otherItem.width, 10)
height: calculateMyHeight()
color: { if (width> 10) "blue"; else "red"
حالت‌ها
حالت‌ها یک رویه برای ترکیب تغییرات به منظور اعمال خصوصیت‌ها در یک واحد معنایی می‌باشد. برای مثال یک کلید دارای حالت‌های «کلیک شده» و «کلیک نشده» می‌باشد یا یک دفترچه تلفن باید دارای حالتهای «فقط خواندنی» یا «قابل تغییر» باشد. هر حالت به این صورت تعریف می‌شود که نام خصوصیت نوشته شده و مقداری متفاوت با مقدار آن در حالت اصلی به آن خصوصیت نسبت داده می‌شود.
مثال:
در حالت پیش فرض myRect در مکان ۰،۰ قرار دارد و در حالت "moved" در مکان ۵۰،۵۰ قرار می‌گیرد؛ و کلیک کردن با ماوس روی آن، حالت پیشفرض (۰،۰)را به حالت "moved" و مکان(۵۰،۵۰)تغییر می‌دهد.
import QtQuick 1.0
Item {
id: myItem
width: 200; height: 200
Rectangle {
id: myRect
width: 100; height: 100
color: "red"
states:
MouseArea {
anchors.fill: parent
onClicked: myItem.state = moved
تغییر حالات می‌تواند با نسبت دادن یک انیمیشن به تغییر مکان انجام شود.
برای مثال، اضافه کردن کد زیر به کد بالا تغییر مکان به حالت "moved" را با یک انیمیشن همراه می‌کند:
transitions:
انیمیشن
انیمیشن‌ها در کیو-ام-ال به وسیله نسبت دادن انیمیشن به خصوصیات اشیاء انجام می‌شود. به خصوصیاتی مانند type real, int, color, rect, point, size, and vector3d می‌توان انیمیشن نسبت داد.
کیو-ام-ال دارای سه نوع کلی انیمیشن است:انیمیشن‌های پایه‌ای خصوصیت‌ها(basic property animation) ، انتقال (transitions) و رفتار خصوصیت‌ها (property behaviors).
ساده‌ترین نوع انیمیشن انیمیشن خصوصیت هاست، که می‌تواند به تمام خصوصیت‌های لیست شده در بالا را نسبت داده شود.
انیمیشن خصوصیت می‌تواند به عنوان یک مقدار و با کلمه کلیدی Animation به یک خصوصیت نسبت داده شود. این نوع انیمیشن به ویژه برای انیمیشن‌هایی که تکرار در آنها وجود دارد مفید است.
مثال زیر یک انیمیشن حجیم شدن(bouncing) می‌سازد.
Rectangle {
id: rect
width: 120; height: 200
Image {
id: img
source: "pics/qt.png"
x: 60 - img.width/2
y: 0
SequentialAnimation on y {
loops: Animation.Infinite
NumberAnimation { to: 200 - img.height; easing.type: Easing.OutBounce; duration: 2000
PauseAnimation { duration: 1000
NumberAnimation { to: 0; easing.type: Easing.OutQuad; duration: 1000