Skocz do zawartości

Kurs Qt – #5 – Budowa interfejsów z Qt Quick i QML


Komentator

Pomocna odpowiedź

Kurs Qt – #5 – Budowa interfejsów z Qt Quick i QML

W tej części zajmiemy się omówieniem QML oraz Qt Quick. Poznanie tych nowych mechanizmów ułatwi nam tworzenie estetycznych interfejsów. Zaczniemy od napisania i przetestowania prostej aplikacji. Następnie omówimy na jej przykładzie QML i porównamy takie podejście z Qt Widgets.

UWAGA, to tylko wstęp! Dalsza część artykułu dostępna jest na blogu.

Przeczytaj całość »

Poniżej znajdują się komentarze powiązane z tym wpisem.

Link do komentarza
Share on other sites

5 minut temu, Shog napisał:

Czy przed nauką QML wypadałoby poznać JavaScript/HTML/CSS? (tak jak żeby poznać QT najpierw trzeba znać C++)

Podstawy podstaw JS (zmienne, funkcje, operacje na stringach i tablicach, obiekty w JS) na pewno będą przydatne, pozostałe problemy można rozwiązywać w trakcie nauki. Znajomość HTML i CSS nie jest wymagana. Za dokumentacją Qt:

Cytat

JavaScript is used as a scripting language in QML, so you may want to learn a bit more about it (see the Javascript Guide) before diving deeper into QML. It's also helpful to have a basic understanding of other web technologies like HTML and CSS, but it's not required.

Dobre wprowadzenie do QML znajdziemy w dokumentacji. I to powinno w zupełności wystarczyć.

  • Lubię! 2
Link do komentarza
Share on other sites

Zarejestruj się lub zaloguj, aby ukryć tę reklamę.
Zarejestruj się lub zaloguj, aby ukryć tę reklamę.

jlcpcb.jpg

jlcpcb.jpg

Produkcja i montaż PCB - wybierz sprawdzone PCBWay!
   • Darmowe płytki dla studentów i projektów non-profit
   • Tylko 5$ za 10 prototypów PCB w 24 godziny
   • Usługa projektowania PCB na zlecenie
   • Montaż PCB od 30$ + bezpłatna dostawa i szablony
   • Darmowe narzędzie do podglądu plików Gerber
Zobacz również » Film z fabryki PCBWay

1 godzinę temu, MC2Systems napisał:

Czy da się z użyciem QT stworzyć takie interfejsy jak np. ten pod linkiem? 
https://pl.pinterest.com/pin/372532200422210254/

Nigdy takich nie robiłem, ale na tyle na ile znam możliwości Qt to myślę że z pewnością da się takie stworzyć. Natomiast do takich rzeczy potrzebujesz już pomocy dobrego grafika, który stworzy dla Ciebie wszystkie takie ładnie futurystyczne assety. Mając je gotowe to już raczej rzemieślnicza robota.

Biedniejszą wersję takiego interfejsu możesz znaleźć w tym przykładzie: https://doc.qt.io/archives/qt-5.10/qtquickcontrols2-automotive-example.html - jak spojrzysz w pliki projektu to samego kodu interfejsu nie jest jakoś bardzo dużo, natomiast trzon całej aplikacji stanowi masa grafik.

1 godzinę temu, MC2Systems napisał:

Zastanawiam się na ile zaawansowane interfejsy da się wygenerować z wykorzystaniem Rpi z panelem dotykowym 7".

Nie wiem jak w przypadku innych modeli ale np. dla modelu 3B+ (ten testowałem), można zbudować Qt ze źródeł które wykorzysta sprzętowe wsparcie dla OpenGLEGLFS. Ze sprzętowym wsparciem raczej nie powinno być większych problemów z generowaniem takich interfejsów. 

Budując Qt ze źródeł mamy możliwość wykorzystania najnowszej wersji biblioteki oraz dodatkowo zapewnić sobie np. wspomniane powyżej wsparcie sprzętowe, czego np. może nie mieć wersja dostarczona przez dystrybucję.

Edytowano przez Matthew11
  • Lubię! 2
Link do komentarza
Share on other sites

Dzien dobry,

Zacząłem sobie przerabiac nie dawno ten kurs qt creatora. I mam problem, w tej czesci nr 5 tego kursu pod koniec autor wybiera typ projektu:

Qt Quick Application - Scroll

ktorego ja nigdzie nie mam do wyboru w qt creator- najnowsza wersja i qt 6.40.

Edytowano przez Masterofironfist
poprawa błędów pisowni
Link do komentarza
Share on other sites

@Masterofironfist Od jakiegoś czasu QtCreator posiada tylko 3 szablony aplikacji - konsolowa, Qt Widgets i Qt Quick - ale niestety nie można już wybrać szablonu Scroll i podobnych. Ale wybierając Qt Quick Application nadal możemy skorzystać lub zaimplementować własny scroll za pomocą: ScrollView QML:

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15

Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")

    ScrollView {
        id: view
        anchors.fill: parent

        ListView {
            model: 20
            delegate: Rectangle {
                required property int index
                width: view.width
                height: 50

                border.color: "black"

                Text {
                    anchors.centerIn: parent
                    text: "Item " + index
                }
            }
        }
    }
}

512288628_Screenshotfrom2022-10-2409-52-46.thumb.png.52321ebb67d526468e03ec6b1a061e6c.png

Edytowano przez Matthew11
  • Lubię! 1
Link do komentarza
Share on other sites

Dołącz do dyskusji, napisz odpowiedź!

Jeśli masz już konto to zaloguj się teraz, aby opublikować wiadomość jako Ty. Możesz też napisać teraz i zarejestrować się później.
Uwaga: wgrywanie zdjęć i załączników dostępne jest po zalogowaniu!

Anonim
Dołącz do dyskusji! Kliknij i zacznij pisać...

×   Wklejony jako tekst z formatowaniem.   Przywróć formatowanie

  Dozwolonych jest tylko 75 emoji.

×   Twój link będzie automatycznie osadzony.   Wyświetlać jako link

×   Twoja poprzednia zawartość została przywrócona.   Wyczyść edytor

×   Nie możesz wkleić zdjęć bezpośrednio. Prześlij lub wstaw obrazy z adresu URL.

×
×
  • Utwórz nowe...

Ważne informacje

Ta strona używa ciasteczek (cookies), dzięki którym może działać lepiej. Więcej na ten temat znajdziesz w Polityce Prywatności.