QML Model-View 实战

本例实现一个神奇宝贝展示台,用户可以点击神奇宝贝头像,来展示神奇宝贝信息，也可以实现点击头像恢复之前状态(没有实现)，如果要实现这种情况需要另定义一种状态来取消之前的锚点,不然会出现错误

先来看看效果图

点击图像后

上代码:

import QtQuick 2.7

Rectangle {
    width:500;
    height:500;
    ListModel {
        id:listModel;
        ListElement {
            name:"蓝炎鸟";
            src:"./images/brid.png";
            intro:"鸟神奇宝贝,呆呆的娇小外表却隐藏着巨大的能量,释放的蓝色火焰可以燃烧一切";
        }
        ListElement {
            name:"恶岩犬";
            src:"./images/bulldog.png";
            intro:"恶神奇宝贝,一般具有自己的领地,如果被人类打扰,将会毫不留情的攻击";
        }
        ListElement {
            name:"呆呆娃";
            src:"./images/frog.png";
            intro:"水神奇宝贝,喜欢独自发呆,受到惊扰,能够以火箭的速度逃离";
        }
        ListElement {
            name: