একক উবুন্টু এসডিকে লক্ষ্যযুক্ত স্পর্শ এবং পৃথক বিন্যাস সহ ডেস্কটপ কি?


9

আমি জানি যে টাচ অ্যাপ্লিকেশনগুলি একই ইউআই সহ ডেস্কটপে চলবে, তবে আমি ভাবছিলাম যে কোনও একক উবুন্টু এসডিকে অ্যাপ্লিকেশনটি ডেস্কটপ মোডে চলাকালীন ডেস্কটপ স্টাইল ইউআই উপাদানগুলির সাথে একটি মাল্টি উইন্ডো ইউআই করা সম্ভব হবে কি না? টাচ প্ল্যাটফর্মগুলিতে চলার সময় একটি পৃথক স্পর্শ UI সরবরাহ করে।

উত্তর:


6

উইন্ডোর আকারের উপর নির্ভর করে বিন্যাসের দিকগুলি পরিবর্তন করা বিভিন্ন উপায়ে সম্পন্ন করা যায়। সর্বাধিক প্রাথমিক স্তরে, আপনি মাত্রাগুলির উপর ভিত্তি করে বিভিন্ন মানগুলিতে বৈশিষ্ট্য সেট করতে পারেন। এখানে একটি ন্যূনতম উদাহরণ যা একটি উইন্ডো স্কোয়ার আঁকে যা আপনি উইন্ডোটি বড় করে তুললে কমলা রঙে পরিণত হয়:

সাথে চালাও qmlscene path/to/file.qml

import QtQuick 2.0
import Ubuntu.Components 0.1

MainView {
    id: root
    width: units.gu(50)
    height: units.gu(50)

    Rectangle {
        id: hello
        color: parent.width > units.gu(60) ? UbuntuColors.orange : UbuntuColors.warmGrey
        anchors.fill: parent
    }
}

অবশ্যই আপনার আবেদনে আরও জটিল উপাদান থাকলে এটি কিছুটা ক্লান্তিকর হতে পারে। এটির সাথে সহায়তার জন্য, উবুন্টু টুলকিট একটি শর্তসাপেক্ষ লেআউট উপাদান সরবরাহ করে যেখানে আপনি শর্ত পূরণ করার পরে সক্রিয় করা হবে এমন বিভিন্ন লেআউট সংজ্ঞায়িত করতে পারেন। এটি গতিশীলভাবে ঘটে এবং আপনি উইন্ডোটির আকার পরিবর্তন করার সাথে সাথে পরিবর্তনগুলি দেখতে পাবেন।

এখানে আরও জটিল উদাহরণ ব্যবহার করে ConditionalLayout:

import QtQuick 2.0
import Ubuntu.Components 0.1
import Ubuntu.Components.ListItems 0.1 as ListItem
import Ubuntu.Layouts 0.1

MainView {
    id: root
    width: units.gu(50)
    height: units.gu(75)

    Page {
        anchors.fill: parent

        Layouts {
            id: layouts
            anchors.fill: parent
            layouts: [

                ConditionalLayout {
                    name: "flow"
                    when: layouts.width > units.gu(60)

                    Flow {
                        anchors.fill: parent
                        flow: Flow.LeftToRight

                        ItemLayout {
                            item: "sidebar"
                            id: sidebar
                            anchors {
                                top: parent.top
                                bottom: parent.bottom
                            }
                            width: parent.width / 3
                        }

                        ItemLayout {
                            item: "colors"
                            anchors {
                                top: parent.top
                                bottom: parent.bottom
                                right: parent.right
                                left: sidebar.right
                            }
                        }
                    }
                }
            ]

            Column {
                id: sidebar
                anchors {
                    left: parent.left
                    top: parent.top
                    right: parent.right
                }
                Layouts.item: "sidebar"

                ListItem.Header {
                    text: "Ubuntu Color Palette"
                }

                ListItem.Standard {
                    id: orangeBtn
                    text: "Ubuntu Orange"
                    control: Button {
                        text: "Click me"
                        onClicked: {
                            hello.color = UbuntuColors.orange
                        }
                    }
                }

                ListItem.Standard {
                    id: auberBtn
                    text: "Canonical Aubergine"
                    control: Button {
                        text: "Click me"
                        onClicked: {
                            hello.color = UbuntuColors.lightAubergine
                        }
                    }
                }

                ListItem.Standard {
                    id: grayBtn
                    text: "Warm Grey"
                    control: Button {
                        text: "Click me"
                        onClicked: {
                            hello.color = UbuntuColors.warmGrey
                        }
                    }
                }
            } // Column

            Rectangle {
                id: hello
                Layouts.item: "colors"
                color: UbuntuColors.warmGrey
                anchors {
                    top: sidebar.bottom
                    bottom: parent.bottom
                    left: parent.left
                    right: parent.right
                }

                Label {
                    anchors.centerIn: parent
                    text: "Hello (ConditionalLayout) World!"
                    color: "black"
                    fontSize: "large"
                }
            }
        } // Layouts
    } // Page
} // Main View

যখন ডিফল্ট ফোনের মতো আকারে থাকে তখন মনে হয়:

ফোন লেআউট

এটি যখন কোনও ট্যাবলেট বা ডেস্কটপ-মতো আকারে প্রসারিত হয় তখন মনে হয়:

ট্যাবলেট বিন্যাস


এটি বিভিন্ন পর্দার আকারের সাথে সামঞ্জস্য করার জন্য দুর্দান্ত। যদি ডেস্কটপে অ্যাপটি চলমান থাকে তবে আমি কি ডেস্কটপ-স্টাইলের উপাদানগুলি মেনু বার এবং একাধিক উইন্ডোর মতো ব্যবহার করতে পারি?
sjmulder

@ sjmulder এখনও না, অন্তত উবুন্টু এসডিকে ব্যবহার না করে using
আইবেলিভ

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.