Hiển thị các bài đăng có nhãn QML. Hiển thị tất cả bài đăng
Hiển thị các bài đăng có nhãn QML. Hiển thị tất cả bài đăng

08/09/2017

Qt/QML: Four-finger swipe gesture bug

Problem:
I am developing an application for Android/iOS.
I am using MouseArea to make my button.
I am stuck in the following case:
Touch on screen with 4 fingers, 1 finger among them touch on the button.
Swipe the screen.
The application become inactive state. I display a item as a popup (the button will go into disabled state) when the application become active state again. Then the popup will be hidden, the button is enabled state.
Now the button doesn't receive mouse event again.
Solution:
I override notify method of QGuiApplication:

bool MyApplication::notify(QObject *receiver, QEvent *event){
    QEvent::Type t = event->type();
    switch(t){
    case QEvent::MouseButtonPress:{
        QString classname(receiver ->metaObject()->className());
        lastReceiver = receiver;
    }
        break;
    case QEvent::MouseButtonRelease:
        lastReceiver = NULL;
        break;
    case QEvent::ApplicationStateChange:
        //To background
        if (lastReceiver != NULL){
            QQuickItem*item = qobject_cast< QQuickItem*>(lastReceiver);
            if (item != NULL){
                if(QGuiApplication::applicationState() == Qt::ApplicationInactive){
                    item ->ungrabMouse();
                }
                if(QGuiApplication::applicationState() == Qt::ApplicationActive ){
                    item ->grabMouse();
                    lastReceiver = NULL;
                }
            }
        }

        break;
    default:
        break;
    }
    return QGuiApplication::notify(receiver,event);
}

06/08/2017

Qt/QML: Scale Text

Lập trình Qt/QML cho di động (mobile) nhất là Android, không ít lần mình phải đối mặt với bài toán làm sao đoạn text có thể lớn nhỏ đủ trong khung đất dành cho nó dù cho font chữ có thay đổi tuỳ theo thiết bị. 
Sau đây là cách làm của mình:
NLCScalableText.qml:
import QtQuick 2.7
Text {
    /**
      * This is scale rate we want the text must follow.
      * incase that we want share the scale rate to other text.
      */
    property real niceScale:1.0;
    /**
      * This is the scale rate we want the text to scale.
      */
    property real wantScale:idNLCTextPrivate.getWantScale();
    id:idNLCText
    QtObject{
        id:idNLCTextPrivate
        function getWantScale(){
            if (idNLCText.width > 0){
                return (idNLCText.paintedWidth/idNLCText.lineCount) > idNLCText.width ? ((idNLCText.width*idNLCText.lineCount) / idNLCText.paintedWidth): 1;
            }else{
                return 1.0;
            }
        }
        function getScale(){
            return Math.min(idNLCText.niceScale, getWantScale());
        }
    }
    scale:idNLCTextPrivate.getScale();
    horizontalAlignment: Text.AlignHCenter
}

24/06/2012

Lập trình Qt cho Android

Nếu bạn đã có một chương trình Qt chạy khá tốt trên các nền tảng khác bây giờ bạn muốn chuyển nó qua Android mà bạn không muốn tốn nhiều công sức để viết lại từ đầu sử dụng Android SDK thì đây là bài viết phù hợp cho bạn.
Tôi cũng là một nhà phát triển phần mềm sử dụng Qt/QML. Tôi cũng có một mong muốn giống bạn. Tôi đã bắt đầu từ Android Lighthouse. Tuy nhiên gần đây tôi đã phát hiện ra Necessitas. Necessitas đã cung cấp cho người  dùng một bộ SDK khá hoàn chỉnh để phát triển chương trình Qt/QML cho Android. Necessitas sử dụng Android Lighthous, Qt Creator, Ministro. Tuy Necessitas chưa được ổn định nhưng đã phần nào đáp ứng nhu cầu của tôi.
Tôi đã thử phát triển chương trình QML và deploy trên Android phone. Chương trình chạy rất OK.

05/02/2012

Bug fix for folderlistmodel

If you have used folderlistmodel in Qt.labs.folderlistmodel 1.0, I am sure that it will make you disappointed because it cannot reflect the change from system file such as file deleted, file renamed, ...
I found that folderlistmodel is based on QDirModel which is a deprecated class. I decided to implement it again using QFileSystemModel because QFileSystemModel use file system watcher.
I have succeeded!If you have same problem as me, drop me a line...


11/08/2011

Sử dụng Photoshop/GIMP để thiết kế QML

Sử dụng QML để lập trình giao diện là điều rất hấp dẫn cho những lập trình viên Qt.
Kể từ phiên bản 2.1 Qt Creator đã hỗ trợ khá tốt cho việc thiết kế QML. Tuy nhiên để có một GUI đẹp Qt developer phờ nhờ đến các phần mềm xử lý đồ hoạ chuyên nghiệp như Adobe Photoshop hay GIMP (nếu bạn là thần dân của cộng đồng FOSS). Sau khi có bản thiết kế đồ hoạ để chuyển sang mã QML lại là một bài toán không khó nhưng khá nhàm chán và tốn nhiều công sức. Xuất phát từ ý tưởng slice của Adobe Photoshop chuyển bản thiết kế website sang trang HTML người ta đã viết các plugin cho Adobe Photoshop và GIMP để cho phép design có thể export bản thiết kế của mình sang mã QML. Tôi là thần dân của FOSS nên tôi sẽ giới thiệu với các bạn cách dùng GIMP để export ra QML:
1) Download "Gimp-Python support easier" từ liên kết http://photocomix-resources.deviantart.com/art/Gimp-Python-support-easier-74889017.Giải nén và tiến hành cài đặt tất cả các gói phần mềm có trong đó.
2) Down load GIMP for Windows từ http://gimp-win.sourceforge.net/stable.html. Khi cài đặt nhớ chọn "Customize" để chọn Gimp-Python.
3) Download extension từ http://libregraphicsworld.org/news.php?readmore=597.Đọc file README để biết cách cài đặt.
Bây giờ mở GIMP lên bạn đã nhìn thấy một menu item "Export to QML" đã được thêm vào menu "File".
Xem video:

 Reference:
  1. Jens Bache-Wiig, Exporting QML from Photoshop and GIMP 
  2. QML exporting script makes GIMP a UI design tool 


11/04/2011

QML Internationalization

  • Bước 1: Sử dụng một trong các hàm sau để đánh dấu các chuỗi cần biên dịch: qsTr(), qsTranslate(), QT_TR_NOOP() và QT_TRANSLATE_NOOP(). Ví dụ: Text {text:qsTr("Monday")}
  • Bước 2: Sử dụng lupdate để tạo translation source file:
    ví dụ:
    lupdate vidu.qml -ts vidu.ts
    Chúng ta dùng Linguist mở vidu.ts, dịch rồi release thu được tập tin vidu.qm
  • Bước 3: Thực thi qmlviewer với tuỳ chọn translatation:
    qmlviewer -translation vidu.qm vidu.qml