Форум программистов, компьютерный форум, киберфорум
Наши страницы
C++ Qt
Войти
Регистрация
Восстановить пароль
 
Рейтинг 5.00/4: Рейтинг темы: голосов - 4, средняя оценка - 5.00
BlinCT
1 / 1 / 0
Регистрация: 01.11.2010
Сообщений: 166
#1

Дерганая анимация в StackView QML

14.07.2018, 11:10. Просмотров 715. Ответов 4
Метки нет (Все метки)

Всем привет.
У меня странная анимация при открытии в StackView когда я хочу открыть следующий слайд.
Я сделал видео в пару секунд и расшарил в своем дропбоксе, я думаю оно даст понять что именно происходит.
https://www.dropbox.com/s/24kmgvmg9q...42-54.mkv?dl=0
Кто в этом понимает подскажиет какую именно часть кода надо скинуть в чем может оказатся проблема?
Буду очень признателен за совет.

Добавлено через 13 часов 17 минут
Вообще вот все элементы что тут задействованны

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
Drawer
{
    id: rootDrawer
    property Component menuContent1: MenuContent1 { }
    property Component menuContent2: MenuContent2 { }
 
    property var componentMap: {
        "General": menuContent1,
        "Sound": menuContent2,
//        "Notice": menuContent3
    }
 
    StackView {
        id: stackView
        anchors.top: parent.top
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.bottom: parent.bottom
 
        initialItem: ListView {
            model: ListModel {
                ListElement { title: "General" }
                ListElement { title: "Sound" }
                ListElement { title: "Notice" }
            }
 
            delegate: Button {
                width: stackView.width
                height: rootDrawer.height * 0.10
                text: title
 
                background: ButtonStyleCustom {
                    fontColor: rootDrawer.darkFontColor
                    rightAlignedIconSource: "Images/icon-go.png"
                }
 
                onClicked: {
                    if (stackView.depth == 1)
                    {
                        stackView.push(componentMap[title]);
                        stackView.currentItem.forceActiveFocus();
                    }
                }
            }
        }
    }
}
Первый элеент из пункта
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
Item {
    id: root
 
    ColumnLayout
    {
        spacing: 4
        anchors.top: parent.top
        anchors.left:parent.left
        anchors.right: parent.right
 
        ControlViewToolbar {
            Layout.fillWidth: true
        }
 
 
        RadioButtonGroup {
            id: radioButtons
            Layout.fillWidth: true
        }
 
        LanguageItem {
            id: languageItem
 
            Layout.fillWidth: true
            height: 70
        }
 
        SystemTrayCheckBox {
            id: sytemTray
            Layout.fillWidth: true
            height: 70
        }
    }
}
Если важно то сама кнопка на тулбаре для возврата
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
BlackButtonBackground {
    height: rootDrawer.height * 0.10
 
    Button {
        id: back
        width: parent.height
        height: parent.height
        anchors.left: parent.left
        anchors.bottom: parent.bottom
 
        Image {
            anchors.centerIn: parent
 
            source: "Images/icon-back.png"
            height: text.implicitHeight
            fillMode: Image.PreserveAspectFit
        }
 
        onClicked: stackView.pop()
    }
 
    Text {
        id: text
        font.pixelSize: parent.height * 0.25
    }
}
А так выглядит кастомная часть каждого из пунктов, то чем заполняется стек
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
Rectangle
{
    id: root
    property color fontColor
    property url rightAlignedIconSource
 
    Text {
        id: textSingleton
    }
 
    ButtonBackground {
        anchors.fill: parent
    }
 
    implicitWidth: row.implicitWidth
    implicitHeight: row.implicitHeight
    baselineOffset: row.y + text.y + text.baselineOffset
 
    Row {
        id: row
        anchors.fill: parent
        anchors.leftMargin: textSingleton.implicitHeight
        anchors.verticalCenter: parent.verticalCenter
        anchors.horizontalCenter: parent.horizontalCenter
 
        Image {
            width: Math.min(sourceSize.width, height)
            height: text.implicitHeight
            fillMode: Image.PreserveAspectFit
        }
        Text {
            id: text
            font.pixelSize: root.height * 0.25
            font.family: openSans.name
            horizontalAlignment: Text.AlignLeft
            verticalAlignment: Text.AlignVCenter
            anchors.verticalCenter: parent.verticalCenter
        }
    }
 
    Loader {
        active: rightAlignedIconSource.toString().length !== 0
        anchors.verticalCenter: parent.verticalCenter
        anchors.right: parent.right
        anchors.rightMargin: textSingleton.implicitHeight
 
        sourceComponent: Image {
            width: Math.min(sourceSize.width, height)
            height: text.implicitHeight
            fillMode: Image.PreserveAspectFit
            source: rightAlignedIconSource
        }
    }
}
Вопрос так и остается нерешенным, почему так странно раскрывается и сворачивается стек...
0
Лучшие ответы (1)
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
14.07.2018, 11:10
Ответы с готовыми решениями:

Пушить в StackView по нажатию кнопки QML
Привет! Не могу сообразить как организовать запушивание в StackView каждый раз...

Дополнительные окна и анимация в Qml
Проблема такая, есть нарисованный график, нарисованный в прямоугольнике, я...

Анимация движения по кругу (qml)
Как сделать движение по кругу без использования канвы?

Подсветка QML элементов QML-ного плагина в QtCreator в случае нахождения QML файлов плагина в ресурсах!
Здравствуйте! Если сделать плагин для QML и подключить его в основном проекте...

TextEdit не получает фокус внутри StackView
Привет! Внутри StackView есть компонент внутри которого есть TextEdit с...

4
Mikhail1990
27 / 26 / 6
Регистрация: 22.03.2014
Сообщений: 275
14.07.2018, 12:35 #2
Надо поменять easingType на открытие - закрытие навигационной панели в stackView.
C++ (Qt)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
pushEnter: Transition {
            PropertyAnimation {
                property: "opacity"
                easing.type: Easing.Linear
                from: 0
                to: 1
                duration: animationDurationStackView
            }
        }
        pushExit: Transition {
            PropertyAnimation {
                property: "opacity"
                easing.type: Easing.Linear
                from: 1
                to: 0
                duration: animationDurationStackView
            }
        }
        popEnter: Transition {
            PropertyAnimation {
                property: "opacity"
                from: 0
                to: 1
                duration: animationDurationStackView
            }
        }
        popExit: Transition {
            PropertyAnimation {
                property: "opacity"
                from: 1
                to: 0
                duration: animationDurationStackView
            }
        }
Если это то что я увидел. А там хз анимация как анимация.
0
BlinCT
1 / 1 / 0
Регистрация: 01.11.2010
Сообщений: 166
14.07.2018, 14:22  [ТС] #3
А вы не заметили разве что при открытии там как то часть элементов не плавно уходит а как то исчезает чтоли?
То есть я сравнимал в подобным и там работает хорошо, а у меня это как то не так работает.

И по поводу easingType это где надо поменять? Я чет ничего такого у себя найти не могу.
0
Mikhail1990
27 / 26 / 6
Регистрация: 22.03.2014
Сообщений: 275
14.07.2018, 16:17 #4
Лучший ответ Сообщение было отмечено BlinCT как решение

Решение

BlinCT, это находится в StackView на сигнал пуш/поп надо добавить переход Transition.
C
1
2
3
4
5
6
7
8
9
10
11
StackView{
pushEnter: Transition {
            PropertyAnimation {
                property: "opacity"
                easing.type: Easing.Linear
                from: 0
                to: 1
                duration: animationDurationStackView
            }
      }
}
Перемотай на Transition

Добавлено через 3 минуты
Цитата Сообщение от BlinCT Посмотреть сообщение
А вы не заметили разве что при открытии там как то часть элементов не плавно уходит а как то исчезает чтоли?
То есть я сравнимал в подобным и там работает хорошо, а у меня это как то не так работает.
По возможности используй Item вместо Rectangle. Тогда исчезнут непонятные артефакты.

Добавлено через 26 минут
BlinCT, Скопируй и вставь это в свой StackView

C++ (Qt)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
property int animationDurationStackView: 200
        pushEnter: Transition {
            PropertyAnimation {
                property: "opacity"
                easing.type: Easing.Linear
                from: 0
                to: 1
                duration: animationDurationStackView
            }
        }
        pushExit: Transition {
            PropertyAnimation {
                property: "opacity"
                easing.type: Easing.Linear
                from: 1
                to: 0
                duration: animationDurationStackView
            }
        }
        popEnter: Transition {
            PropertyAnimation {
                property: "opacity"
                from: 0
                to: 1
                duration: animationDurationStackView
            }
        }
        popExit: Transition {
            PropertyAnimation {
                property: "opacity"
                from: 1
                to: 0
                duration: animationDurationStackView
            }
        }
1
BlinCT
1 / 1 / 0
Регистрация: 01.11.2010
Сообщений: 166
14.07.2018, 16:24  [ТС] #5
Интереснео изменение в работе)
Не совсем то чт оя планировал и хотел но это тоже адекватное изменение.
Спасибо.
0
14.07.2018, 16:24
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
14.07.2018, 16:24

Передача данных через stackView.push
Как правильно передать объект при stackView.push()... onClicked:...

QMl/QT при нажатии на кнопку должен окрыться другой qml файл
Додал anchors Вот что я сделал: import QtQuick 2.5 import QtQuick.Controls...

Как подключить QML-файл в C++ по моде, а также получить ссылки на QML-элементы в C++
Читал в интернете, как подключать QML-файлы. Кто-то использует QQmlView, кто-то...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru