1

我正在尝试使用 intel xdk 编写应用程序我需要编辑背景，我尝试stile="background-color:blue"在正文中添加参数但是当我进入设计选项卡时，如果我返回代码，什么都不会发生（显示标准背景）选项卡，它会删除打开标签，但不会删除关闭标签 end 不会显示任何错误...

一些想法？保存前后都有代码

<!DOCTYPE html>
<html><!--HTML5 doctype-->

<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="Pragma" content="no-cache">
<script type="text/javascript" charset="utf-8" src="intelxdk.js"></script>
<script type="text/javascript" language="javascript">
    var isIntel=window.intel&&window.intel.xdk
    // This event handler is fired once the intel libraries are ready
    function onDeviceReady() {
        //hide splash screen now that our app is ready to run
        intel.xdk.device.hideSplashScreen();
        setTimeout(function () {
            $.ui.launch();
        }, 50);
    }
    //initial event handler to detect when intel is ready to roll
    document.addEventListener("intel.xdk.device.ready", onDeviceReady, false);
</script>
<script src="js/appframework.ui.min.js"></script>
<script>
    if(isIntel)
        $.ui.autoLaunch = false;
    $.ui.useOSThemes = true; //Change this to false to force a device theme
    $.ui.blockPageScroll();
    $(document).ready(function () {
        if ($.ui.useOSThemes && (!$.os.ios||$.os.ios7))
            $("#afui").removeClass("ios");
    });
</script>
<link href="css/icons.css" rel="stylesheet" type="text/css">
<link href="css/af.ui.css" rel="stylesheet" type="text/css">
</head>

<div id="afui" class="ios">
    <div id="header" class="header"></div>
    <div id="content" style="">
        <div class="panel" title="Main" id="main" selected="selected" style="" data-appbuilder-object="page"
        data-header="header_1">

        </div>
    </div>
    <div id="navbar" class="footer">something on footer 
    </div>


    <header id="header_1" data-appbuilder-object="header"> <a id="backButton" href="#" class="button">Baca</a>
        <h1 class="">Custom Title</h1> 
    </header>
</div>
    <body style="background-color:blue">
        bla bla bla
</body>

</html>

打开图形选项卡后，它会删除 de body 标签

  <header id="header_1" data-appbuilder-object="header"> <a id="backButton" href="#" class="button">Baca</a>
        <h1 class="">Custom Title</h1> 
    </header>
</div>

bla bla bla
</body>

</html>

而且我不能再添加...

对不起，我的英语不好。

4

1 回答 1

4

要实现我认为您正在尝试做的事情，您必须更改 App Starter/App Framework 应用程序中的面板背景样式。

css 文件 af.ui.css 应用了每个底层平台的样式指南，因此 iOS 应用程序看起来像 iOS 小部件、Android 应用程序像 Android、Windows 像 Windows 等。

App Starter 使用 App Framework 并使用面板为您创建入门布局。当您更改背景颜色时，它会被 af.ui.css 覆盖，因为面板呈现在主体背景之上。

使用英特尔 XDK 版本 876：

  • 点击开始一个新项目
  • 单击使用应用程序启动器
  • 单击“开发”选项卡
  • 点击代码按钮
  • 将第 41 行或 div 类“面板”更改为： div class="panel" title="Main" data-nav="nav_0" id="main" selected="selected" style="background-color: blue;" （见下面的代码）
  • 单击文件>>保存
  • 点击设计按钮

面板背景应为蓝色。

您需要将您的 html div 标签放在 head 标签之后的 body 标签中。这是您的用户可见内容应该始终去的地方。见下文：

<body>
<div id="afui" class="ios">
<div id="header" class="header"></div>
<div id="content" style="">
    <div class="panel" title="Main" data-nav="nav_0" id="main" selected="selected"
    style="background-color: blue;">
        <a class="button" href="#" style="" data-appbuilder-object="button">Hello World</a>
    </div>
</div>
<div id="navbar" class="footer">
    <a href="#main" class="icon home">Home</a>
</div>
<header id="header_0" data-appbuilder-object="header">
    <a id="backButton" href="#" class="button backButton" style="visibility: visible; ">Back</a>
    <h1 id="pageTitle" class="">test</h1> 
</header>
<nav id="nav_0" data-appbuilder-object="nav">
    <h1>Side Menu</h1>
</nav>
</div>
</body>

我能够重现 body 标签消失，这是因为 AppStarter 尝试解析设计视图的布局，有时会删除它不理解的标签。我将为英特尔 XDK 提交一个错误，即在 App Starter 中的 body 标签上设置样式不应删除或修改现有标签。

于 2014-05-07T20:40:20.993 回答