Как я могу показать изображение внутри круга с помощью qml?

Привет я новичок в ежевике. Я хочу показать изображение внутри круга с помощью qul.


blackberry-10 blackberry-cascades
person Ramki Anba    schedule 05.04.2014    source источник
comment
Вы пишете чистое приложение Qt/QML для работы на BlackBerry 10, что возможно, или вы пишете приложение Cascades? Если Cascades, вам действительно следует использовать тег blackberry-cascades вместо QML. Каскады не реализуют все объекты Qt, и обработка изображений немного отличается.   -  person Richard    schedule 06.04.2014
comment
Да, я пишу чистый Qt/QML   -  person Ramki Anba    schedule 07.04.2014
comment
Отлично, тогда ответ @koopajah должен сработать для вас.   -  person Richard    schedule 07.04.2014
comment
Я получаю сообщение об ошибке Несоответствие типа значения свойства по умолчанию 'controls'. Ожидается bb::cascades::Control и найден прямоугольник.   -  person Ramki Anba    schedule 07.04.2014
comment
Есть два способа решить эту проблему в зависимости от того, что вы хотите видеть за пределами круга, содержащего изображение. Вы хотите видеть основные элементы приложения, прозрачную рамку? Или вы хотите иметь рамку с круглым отверстием перед изображением?   -  person Richard    schedule 07.04.2014
comment
Я хочу показать изображение в виде круглой границы.   -  person Ramki Anba    schedule 07.04.2014

Ответы (1)


arrow_upward
1
arrow_downward

Самый простой способ виньетировать изображение — наложить его на другое изображение. В Cascades, если вы создаете контейнер с помощью DockLayout или AbsoluteLayout, вы можете расположить несколько объектов ImageView друг над другом. По умолчанию первый объект будет внизу, последний — вверху. Вы просто создаете изображение с прозрачным окном просмотра нужной вам формы. Вы можете масштабировать изображение во время выполнения, но вы должны сделать его размером с самый большой кадр, который вам понадобится, чтобы сохранить качество. Я использовал Gimp для создания изображения размером 786 x 78 пикселей с белой рамкой и прозрачным кругом посередине и сохранил его в каталоге ресурсов как frame.png. Я взял другое изображение, которое было легко под рукой, и создал проект BlackBerry с этим QML-кодом в подходящем месте:

Page {
        Container {
            layout: DockLayout {

            }
            ImageView {
                imageSource: "asset:///FusionMap.PNG"
                preferredHeight: 360
                preferredWidth: 360

            }
            ImageView {
                imageSource: "asset:///frame.png"
                preferredHeight: 360
                preferredWidth: 360

            }
        }
    }

Вот результат:

введите здесь описание изображения

person Richard    schedule 07.04.2014