用tidesdk制作一个可拖动的透明窗口

2024-01-25

使用TideSDK,如何拥有一个没有Windows风格边框的窗口,并保持可拖动?

我尝试两件事:

首先像这样配置我的 tiapp.xml

<width>3000</width>
<max-width>3000</max-width>
<min-width>0</min-width>
<height>1280</height>
<max-height>1280</max-height>
<min-height>0</min-height>
<fullscreen>false</fullscreen>
<resizable>true</resizable>
<transparency >1.0</transparency >
<transparent-background>true</transparent-background>

并将我的应用程序包含在这样的 div 中:

<!doctype html> 
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Draggable - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <style>
  #draggable { width: 150px; height: 150px; left: 10px}
  </style>
  <script>
  $(function() {
    $( "#draggable" ).draggable();
  });
  </script>
</head>
<body>

<div id="draggable" class="ui-widget-content">
  <p>Drag me around</p>
</div> 
</body>
</html>

这很酷,因为我有完整的 css 可自定义窗口可拖动,但如果我希望它在双屏中工作,我必须将最大宽度设置为 ~4000,并且它看起来最多限制为 3000。 (即使我在 tiapp.xml 文件中设置了更大的值)。请注意,如果我没有设置很大的宽度和高度,当我的应用程序(div)接近限制时,我的桌面上会出现一个滚动条。

我尝试快速执行其他操作来添加标签

<chrome>false</chrome>

这看起来是一个更好的方法,但是,我失去了窗口上的可拖动控件。我不知道如何用javascript拖动tidesdk窗口。可能有解决方案来创建我自己的“chrome”吗?


这个问题的金矿是这个tidesdk google groups帖子上发布的答案:https://groups.google.com/forum/#!topic/tidesdk/jW664E2lPlc https://groups.google.com/forum/#!topic/tidesdk/jW664E2lPlc

首先,您需要提供自己的方式来让用户移动窗口 - 您自己的版本,例如 Windows 8 Metro 风格的顶部可拖动的位置,标题栏曾经是这样的。 举例来说(不用担心样式),例如

  <div id="windowTitleBar">
    <button id="windowMinimize" class="windowMaxMinButtons">[_]</button>
    <button id="windowClose" class="windowMaxMinButtons">[X]</button>
  </div>

其次,在您的 javascript 中,您提供自己的拖动处理,利用Ti.UIAPI。这是我所做的概念验证的示例。
(下面请注意,最小化功能有一个小技巧(?)以使窗口恢复后可以工作。如果您找到更好的方法,请添加您的修复程序,以便每个人都能受益!)

$(document).ready(function() {
    /*
     * WINDOW HIDE
     */
    $("#windowMinimize").click(function()
    {
        event.preventDefault();
        // From http://developer.appcelerator.com/question/131596/minimize-unminimize-under-windows-7
        // One user found if we follow this magical sequence (max-unmax-min), the
        // window will be responsive after restore. Confirmed on my Win 7
        Ti.UI.getMainWindow().maximize();
        Ti.UI.getMainWindow().unmaximize();
        Ti.UI.getMainWindow().minimize();
    });

    $(".maximize").click(function() {
        event.preventDefault();
        if(!Ti.UI.getMainWindow().isMaximized())
        {
            Ti.UI.getMainWindow().maximize();
        } else {
            Ti.UI.getMainWindow().unmaximize();
        }
    });

    /*
    * WINDOW CLOSE
    */


    $("#windowClose").click(function()
    {
        event.preventDefault();
        Ti.UI.getMainWindow().close();
        //system.window.target.hide();
        Ti.App.exit();
    });

    /*
     * WINDOW "Title Bar"
    */

    $("#windowTitleBar").mousedown ( function ( event )
    {
        event.preventDefault();
        if(!Ti.UI.getMainWindow().isMaximized())
        {
            var diffX = event.pageX;
            var diffY = event.pageY;

            $(document).mousemove ( function ( event )
            {
                event.preventDefault();
                if (event.screenY - diffY < screen.height-100)
                Ti.UI.getMainWindow().moveTo(event.screenX - diffX, event.screenY - diffY);
            });
        }
    });

    $(document).mouseup ( function ( event )
    {
        event.preventDefault();
        $(document).unbind('mousemove');
    });

    $("#windowTitleBar").dblclick ( function ( event )
    {
        event.preventDefault();
        if (!Ti.UI.getMainWindow().isMaximized())
            Ti.UI.getMainWindow().maximize();
        else
            Ti.UI.getMainWindow().unmaximize();
    });
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

用tidesdk制作一个可拖动的透明窗口 的相关文章

  • MongoDB——通过多个键查找重复文档

    我有一个包含如下所示文档的集合 id ObjectId 55b377cb66b393427367c3e2 comment This is a comment url key 55b377cb66b393427367c3df This is
  • PHPUnit 存根类方法声明为“final”

    我正在为一个类方法编写一个单元测试 该方法使用模拟调用另一个类的方法 只有需要调用的方法被声明为最终方法 因此 PHPUnit 无法模拟它 我可以采取不同的方法吗 example 被嘲笑的班级 class Class To Mock fin
  • npm 无法在 Windows 中运行

    我安装了node js和npm 当我在 Windows 命令提示符下输入 npm v 它返回 2 15 1 但是当我尝试安装如下软件包时 npm install xml parser 我看到有东西正在加载 然后就什么也没有了 出了什么问题
  • 为什么信号处理程序中的打印操作可能会改变死锁情况?

    我得到的简单程序如下 import threading import time import signal WITH DEADLOCK 0 lock threading Lock def interruptHandler signo fra
  • 如何在进程退出之前强制 Nodejs Winston 日志记录到文件

    我在用温斯顿 3 https github com winstonjs winston记录我的数据 但有时它在进程退出之前没有记录错误 以下进程将退出 不登录logfile log const winston require winston
  • Windows x64 的串行/Com 端口监视器 [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 谁能推荐一些好的 Com 端口监控工具 比如 Portmon 它也可以在 Windows x64 上运行
  • 在 WordPress 站点中加载 jquery.js 后加载 javascript 代码

    我在 WordPress 网站的主页上有一个基于 jquery 的自定义滑块 我正在主题的functions php 文件中使用以下代码加载jQuery jquery js 和滑块js jquery advanced slider js f
  • Rails 3 - nil 的未定义方法“map”:NilClass 用于我自己的验证

    我遇到了很奇怪的问题 我有Timetable模型并尝试编写我的自定义验证 所以 现在我只是尝试为字段添加测试错误以确保一切正常 但这不起作用 因此 我尝试更新时间表模型的对象 但是当我不使用测试自定义验证时 一切都很完美 否则我会得到这样的
  • 将 geom_text 中的图例文本颜色与符号匹配[重复]

    这个问题在这里已经有答案了 我正在尝试将图例的文本与分解变量生成的文本的颜色进行颜色匹配geom text 这是一个最小的工作示例 df lt data frame a rnorm 10 b 1 10 c letters 1 10 d c
  • Swift 三个双引号

    我是斯威夫特的新手 该文档说 对于占用多行的字符串 请使用三个双引号 只要与结束引号的缩进相匹配 每个带引号的行开头的缩进就会被删除 例如 let quotation Even though there s whitespace to th
  • 类型错误:“list”和“int”实例之间不支持“>=”

    嗨 我遇到了上述错误 问题出在最后一个函数 get student average 上 如果 results 存储 get average student 值 为什么它不能返回 get letter grade results 的结果 ll
  • 求 pi 的值直到 50 位

    我想计算 PI 的值直到 50 位 如何在java中实现小数点后50位 您无法使用默认数据类型执行此操作 因为您需要 50 位数字 50 log 2 log 10 166 位 这里 BigDecimal 是您可以使用的一种类型 但您应该记住
  • nil 的 Ruby 用例,相当于 Python None 或 JavaScript undefined

    鲁比的怎么样nil体现在代码中 例如 在 Python 中 当默认参数引用另一个参数时 您可以使用 None 作为默认参数 但在 Ruby 中 您可以引用 arg 列表中的其他参数 请参阅这个问题 https stackoverflow c
  • npm 发布 - 从 package.json 中删除脚本?

    在发布我的脚本之前 我在 package json 下有许多脚本来编译咖啡脚本 打字稿和仅限开发人员的命令 一旦发布就没有任何意义 我想知道是否有删除 package json 下某些脚本的程序 考虑到在发布包时 它也会发布 package
  • 在 Matter.js 中旋转相机

    我正在开发一款以太空为背景的自上而下的物理游戏 我希望旋转到视图时始终显示玩家的船朝上 即使船可以旋转 我搜索了文档 但没有找到任何有关旋转世界或渲染器的信息 但我可能不知道要查找的正确术语 这对于 Matter js 来说是可能的吗 我不
  • 使用 ng-template 在 Angular 10 中仅显示博客中的相关条目

    我有一个用 Strapi 制作的博客后端 您可以在其中添加一些内容类型 例如标题字段 描述字段和内容字段 我还有一个布尔内容类型来设置博客是否相关 我在 Angular 中设置了一个 ngFor 来显示我所有的博客条目 但我只想展示相关的内
  • 为什么不同 Android 版本的 apk 大小会增加

    我创建了一个简单的应用程序 由 android studio 生成的 apk 大小为 1 MB 然后我安装在android 2 3版本大小增加到3 48 MB 然后我安装在android 5 0版本大小增加至 5 48 MB 我的问题只是为

随机推荐

  • socket.error:[errno 99] 无法分配请求的地址:flask 和 python

    我有同样的问题 and here https stackoverflow com questions 19246103 socket errorerrno 99 cannot assign requested address and nam
  • 单向来源困境

    我在用OneWayToSource绑定 它似乎总是将我的源属性设置为 null 为什么会这样 这给我带来了麻烦 因为我需要源属性中目标属性的值而不是 null 这是我的代码 MyViewModel cs public class MyVie
  • 使用 Aeson 解析嵌套 JSON 中的数组

    我正在尝试写一个FromJSON埃森的功能 JSON total 1 movies id 771315522 title Harry Potter and the Philosophers Stone Wizard s Collection
  • 在Android中使用notifyItemRemoved或notifyDataSetChanged与RecyclerView

    我正在创建一个要使用 RecyclerView 显示的卡片列表 其中每张卡片都有一个用于从列表中删除该卡片的按钮 当我使用通知项目已删除 要删除 RecyclerView 中的卡片 它会删除该项目并进行良好的动画处理 但列表中的数据未正确更
  • 在 PyYAML 中格式化自定义类输出

    我正在这里研究一个简单的示例 但文档仍然让我有点困惑 这是示例代码 class A yaml YAMLObject yaml tag u A def init self val self val val if name main t dat
  • XamlParseException:自定义控件中的属性丢失,但已定义!

    I 有时我的自定义控件出现以下异常 XamlParseException occurred Unknown attribute Points in element SectionClickableArea Line 10 Position
  • 将 MariaDB 与实体框架结合使用

    最近 我读到一则新闻 说 MariaDB 是 MySQL 的替代品 因为MySQL 对集群 企业版的定价不友好 http www theregister co uk 2013 09 12 google mariadb mysql migra
  • Node X-ray 从 url 集合中爬取数据

    我正在尝试在网站中抓取一个列表 该列表会指向具有相同格式的其他页面 我能够创建所有 a 标签的集合 但是当我尝试访问页面集合时 我尝试用它创建的密钥不会添加到返回的对象中 这是我尝试对堆栈溢出执行的操作的示例 var Xray requir
  • 如何在 Mac 操作系统上永久删除 Xampp?

    我用过Xampp 然后把它删除了 然后 我尝试使用Mamp 有一个错误我不明白 Mamp 作为网络服务器运行得非常完美 但是如果我想使用phpmyadmin 它就不起作用了 例如 我向数据库插入一些内容 它没有显示在 phpmyadmin
  • 多语言数据库,具有默认后备

    我知道 我有一个问题已经被广泛讨论 但在我看来 有一个方面仍然需要澄清 我正在创建一个带有多语言数据库的网络应用程序 我已经找到了一些好的实践文章 例如this https web archive org web 2014101519585
  • 关闭/重启Linux系统的shell脚本

    有没有合适的 shell 脚本来关闭或重新启动 Linux 机器 我尝试过使用 shell 脚本来关闭 但是当我输入sudo shutdown它会要求输入密码 我们如何使用脚本输入密码 我认为另一种更干净的方法 在中创建一个新文件 etc
  • Javascript 中的 Unicode 值 \uXXXX 到字符

    我以前从未这样做过 并且不确定为什么它会输出臭名昭著的内容 编码字符 关于如何输出应有的字符 ASCII Unicode 有什么想法吗 我认为 u0041 u005A应该打印A ZFirefox 报告的 UTF 8 是页面编码 var c
  • 读取文本文件时字符串索引超出范围[重复]

    这个问题在这里已经有答案了 我一直在程序的倒数第二行遇到此错误 我不知道为什么 我所做的只是从文本文件中读取一行 if items 0 86947367 with open read it txt as text file try pric
  • 如何设置组合框中选定的值?

    我在 C Windows 窗体中使用组合框 我绑定的项目列表如下 var employmentStatus new BindingList
  • 创建一个没有 init 方法的类 (Objective-c)

    是否可以创建一个没有 init 方法的类 以强制所有调用者使用工厂方法创建对象 所以基本上 您要确保您的类永远不会使用 init 进行初始化 对吧 你不能这样做exactly你想做的事 但你可以接近 由于您继承自 NSObject 因此您有
  • Android ICS 仿真相机

    我正在尝试使用模拟器查看 ICS 中的 Gallery 应用程序 因此 我启动 AVD 并用相机拍摄几张照片 然后启动图库 当我单击图库中的任何集合时 我收到错误消息 不幸的是 相机已停止 图库应用程序退出 我已经在 Mac 和 Windo
  • java :使用 vfs s3 插件在 Amazon S3 中使用服务器端加密

    为了在 S3 中复制文件 我正在使用vfs s3 2 2 1 jar我发现S3文件对象班级下com intridea io vfs provider s3包裹 我正在其中使用public void copyFrom final FileOb
  • 使用 dplyr 和 SQLite 进行 UTF-8 编码

    我在 SQLite 中有一个表 我想用 dplyr 打开它 我在装有 Win 7 的 PC 上使用 SQLite Expert 版本 35 58 2478 R Studio 版本 0 98 1062 使用 src sqlite 连接到数据库
  • 当 SQL 中的值为空时,如何在 INSERT 上跳过列条目?

    我正在向数据库中插入大量行 但某些列是空白的对于某些行 如何插入而不为这些空白字段分配虚拟值 1 INSERT Leads VALUES name cityName 5 anotherValue 2 INSERT Leads VALUES
  • 用tidesdk制作一个可拖动的透明窗口

    使用TideSDK 如何拥有一个没有Windows风格边框的窗口 并保持可拖动 我尝试两件事 首先像这样配置我的 tiapp xml