SDK do Ubuntu: dificuldade em fazer com que as imagens funcionem no 'aplicativo somente QML' ao implantar no dispositivo armhf

Question

Quando eu implantar meu programa QML somente na área de trabalho usando o Ubuntu SDK, as imagens que eu coloquei na mesma pasta que 'Main.qml' podem ser acessadas e exibidas corretamente no aplicativo usando source: "Pics /testpic.png "

Quando implementados no dispositivo armhf, eles não podem ser acessados dessa maneira e, em vez disso, resulta no erro QML QQuickImage: Não é possível abrir: file: ///opt/click.ubuntu.com etc.

Qual é o melhor método para obter o pacote click para incorporar uma pasta de imagens no binário, onde elas podem ser acessadas e usadas pelo aplicativo?

Se eu alterar a fonte para um endereço da Web, ela mostrará qualquer imagem para a qual eu a aponte, para que ela possa exibir imagens com precisão, mas não tenha acesso à minha própria pasta de imagens.

Há uma pergunta semelhante aqui

Adicionar arquivos de imagem no aplicativo Ubuntu QML com plugins de C ++ (qrc)

e koukouviou adiciona uma nota de rodapé à sua pergunta:

Acabei criando um projeto qmake ao invés de um projeto cmake e consegui incorporar a imagem no binário . Para minhas necessidades, tudo bem, já que estou desenvolvendo um aplicativo simples de prova de conceito

então 'incorporar a imagem no binário' parece exatamente o que eu quero fazer.

Alguém pode saber como fazer isso comigo?

-Simparar, tentei várias tentativas de 'facada no escuro'. Adicionado um arquivo .qrc (que parece ser a solução para um aplicativo 'qml com C ++'), mas o acesso via source: ": /Pics/testpic.png" ou source: "qrc: /Pics/testpic.png" resultou em o mesmo não pode abrir: arquivo etc.

-Também tentei adicionar a pasta no painel do projeto à esquerda do SDK. Ele apareceu em "arquivos extras", mas ainda parece não estar acessível quando implantado no dispositivo armhf.

Qualquer ajuda com isso seria muito apreciada.

Editar

Um esboço rápido de onde eu fui Errado ...

Obrigado a koukouviou por me direcionar para o caminho certo.

Meu principal problema foi que iniciei um projeto QML App com UI simples (qmake) . Eu coloquei tudo junto e testei implantando na área de trabalho e quando eu estava feliz o suficiente com isso eu tentei implantar em um dispositivo armhf. Foi então que descobri que as imagens não apareceriam.

Eu não tinha código C ++ no meu projeto, então parecia desnecessário usar qualquer um dos modelos de projeto 'C ++', então fiz algumas tentativas de 'consertar' meu problema, mas ainda estava usando o 'QML App with Simple UI 'Modelo de projeto.

Adicionar um arquivo QT Resource a um projeto QML App com UI simples parece que deve funcionar: o arquivo .qrc pode ser adicionado e preenchido com suas imagens, mas qualquer referência a source: "qrc:/Pics/testpic.png" falhou.

Tanto quanto sei, não é possível usar seus próprios arquivos de imagem com um 'QML App com UI simples' e implantá-lo em um dispositivo armhf.

Depois de ler a resposta de koukouviou, finalmente pensei que teria que morder a bala e começar um projeto usando o código C ++. Desta vez eu escolhi QtQuick App com QML UI (qmake) que tem a descrição 'Cria um projeto de aplicativo C ++ Ubuntu com uma UI de amostra contendo um Label e um Button' .

Como mencionado anteriormente, eu evitei isso antes porque não tinha código C ++ na minha aplicação & amp; nenhum entendimento real de como usar o C ++ neste (ou qualquer) contexto, mas fiquei feliz em descobrir que não era necessário ajustar ou adicionar qualquer código C ++ e eu poderia apenas fazer minhas alterações no Main.qml e adicionar meus arquivos de imagem para os recursos. Na verdade, já havia um arquivo de recursos .qrc na árvore do projeto por padrão.

    

Answer 1

Foi o que fiz para incorporar uma imagem no "binário":

Estou usando um projeto qmake com a estrutura de pastas padrão no Ubuntu SDK. Eu fiz um diretório para armazenar minhas imagens: project_name / backend / your_click / images . Com a pasta backend eu criei um novo arquivo de recursos resource_file.qrc que contém o seguinte:

<!DOCTYPE RCC><RCC version="1.0">
<qresource>
    <file>images/bigredbutton.png</file>
</qresource>
</RCC>

Para criar o arquivo qrc, acho que você pode clicar com o botão direito, Adicionar novo ... , Qt , Arquivo de recursos do Qt e manualmente edite o arquivo ou crie-o manualmente a partir do zero. Não me lembro qual deles funcionou para mim, experimente-os e deixe-me saber, vou editar a resposta para os outros que podem ter o mesmo problema no futuro.

No meu arquivo Main.qml eu uso a imagem assim:

Image {
    id: btn
    width: 250; height: 250
    fillMode: Image.PreserveAspectFit
    source: "qrc:images/bigredbutton.png"
    MouseArea {
    ...
    }

Aqui está uma captura de tela da estrutura do meu projeto, isso pode ajudar.