Question

您好我是sencha touch2的新手，在设置背景图片时遇到问题。我无法在平板电脑上看到完整的图像，底部已被切断。这是我的观点：

Ext.define('Test.view.LoginPage', {
    extend: 'Ext.form.FormPanel',
    xtype: 'loginPage',

    config:{
        styleHtmlContent:'true',
        scrollable:'false',
        styleHtmlCls:'login-Cls',

        html: '<img class="logo" src="resources/images/login_Landscape_BG.png"/>'

    }

});

我是否需要在个人资料文件夹中添加平板电脑，因为我的应用仅针对平板电脑。你能帮我么。感谢

Answer 1

FWIW，我不得不遵循这个建议： http://www.sencha.com/forum/showthread.php?189231-Background-Image-in-form-Panel

并将其用于我的CSS（首先将TxPanel cls添加到表单面板）： .TxPanel .x-scroll-container { background：url（'img / txbackground.png'）重复中心; }

但是blechhh。这是一个非常丑陋的黑客:-P

Answer 2

试试这个（使用Style配置而不是html配置）：

Ext.define('Test.view.LoginPage', {
    extend: 'Ext.form.FormPanel',
    xtype: 'loginPage',

    config:{
        styleHtmlContent:'true',
        scrollable:'false',
        styleHtmlCls:'login-Cls',
        style: 'background-image:url(resources/images/login_Landscape_BG.png);background-repeat:no-repeat;background-size:100% 100%;'

    }

});

Answer 3

您可以尝试使用html设置完整的背景图片，而不是使用style：

style: 'background-image: url("resources/images/sesto-exterior.jpg"); background-size: 100% 100%;'

Sencha touch 2：在平板电脑中设置表单面板的背景图像

3 个答案: