首页
学习
活动
专区
圈层
工具
发布

手把手带你用Java打造一款对对碰游戏(下篇)

项目实施 在实现对对碰功能之前,回顾一下上一节我们主要完成了开始游戏按钮、分数、时间进度条、退出游戏按钮,8X8的动物矩阵的界面设计; 效果图如下所示: ?...0开始每秒加一,直到进度条的值达到100,计时器停止,不能位置交换动物头像,进度条开始加的时候,开始按钮是不能点击的,当进度条达到100的时候,我们设置开始按钮可以点击状态。...=true; System.out.println("第一次单击的坐标=("+(y1+1)+","+(x1+1)+")"); }else{...x2=x; y2=y; isDoubleClicked=false; System.out.println("第一次单击的坐标=(...完成事件处理开始游戏按钮,退出功能、实现进度条计时、初始化动物矩阵、在水平方向或垂直方向是否有三个或三个以上的相同连接图形在、动物往下移、重新显示所有图形、为空的重新生成随机图形,最后交换位置。

79020

spring boot 用js实现上传文件(包含其他字段)显示进度

代码如下: /** * 上传文件公共组件 * * @param url 上传地址 * @param processBar 进度条 jquery获取的页面组件 * @param speedLab...显示上传速度Label jquery获取的页面组件 * @param uploadBtn 上传按钮 jquery获取的页面组件 * @param cancelBtn 取消上传按钮 jquery获取的页面组件...///获得文件的id var processBar = $("#progressBar"); //获得显示的进度条的id var speedLab=$("#...那是我们上传完成后,返回了int类型的i,在上面提到的组件中,进行了成功的跳转。重复刚才组件中的这行。返回1,就直接进行跳转,带着我们第一次到此页面的内容和该值1。...i=1"+ "&courseid=" + courseid; } 在这个上传课节的页面最下面有我写了js,来接收i的值,并进行alert,没有值不响应,该内容必须在最下面,否则第一次进来不带

2.4K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    HTML5 VideoAPI,打造自己的Web视频播放器

    /video/mv.mp4"> 注意:audio和video元素必须同时包含开始和结束标签,不能使用这样的空元素语法形式。...如果不设置autoplay属性,必须是用户单击播放按钮才会播放音频文件。...loop:loop:(循环播放)告诉浏览器在音频到达末尾时,再从头开始重新播放 preload:auto、mete、none:告诉浏览器如何下载音频 auto:让浏览器下载整个文件,以便用户单击播放按钮时就能播放...meta:告诉浏览器先获取音频文件开头的数据块,从而足以确定一些基本信息(比如音频的总时长) none:**告诉浏览器不必预先下载。恰当地利用这些值,可以节省带宽。...对这一点,不同浏览器的处理方式也不一样。多数浏览器将auto作为默认值,但Firefox的默认值是metadata。

    6.1K40

    全栈开发工程师微信小程序-上(下)

    }] }] }, tap() { console.log('tap') } }) progress 进度条 percent 百分比0~100 show-info 在进度条右侧显示百分比...border-radius 圆角大小 font-size 右侧百分比字体大小 stroke-width 进度条线的宽度 color 进度条颜色 activeColor 已选择的进度条的颜色 backgroundColor...获取焦点 confirm-type 设置键盘右下角按钮的文字 confirm-hold 点击键盘右下角按钮时是否保持键盘不收起 cursor 指定focus时的光标位置 text 文本输入键盘 number...效果 label 用来扩展目标组件的可单击区域. 使用for属性找到对应的id,单击label的区域,会触发对应的控件. 将目标组件作为子标签直接放在label组件内部....效果 min: 最小值 max: 最大值 step: 表示步长 backgroundColor: 表示背景色 activeColor: 表示已经选择的颜色 show-value: 表示是否显示当前value

    2K40

    怎么用 JavaScript 构建自定义的 HTML5 视频播放器

    我们从获取视频和播放按钮开始,代码在 index.js 顶部,如下: // index.js const playButton = document.getElementById('play'); 然后...上面,我们有 progress 元素,用于显示任务的进度条,而 range 类型的 input 允许我们快速无缝浏览视频。...正如你将看到的,这使得我们能够在任何时间点轻松地将进度条和时间范围同步。 继续,当视频被播放我们就更新上述元素的值,以便进度条发挥作用。...然后,我们获取 data-seek 的值并检查其是否有效。如果有效,我们获取该值并更新视频播放过的时间和进度条的位置。...以这种方式设置它是为了使其与视频的音量属性值保持一致,该属性值的范围也是从 0 到 1,其中 0 是最低音量,1 是最高音量。

    13.2K20

    jQuery基础

    ; 上机练习3 练习——编写一个带有两个变量和一个运算符的四则运算函数 需求说明:单击页面上的按钮时,调用函数,使用prompt()方法获取两个变量的值和一个运算符 运算结果使用alert...需求说明: ​ 在页面中有一个图片和一个关闭按钮 ​ 当滚动条向下或向右移动时,图片和关闭按钮随滚动条移动,相对于浏览器的位置固定 ​ 单击“关闭”按钮时,页面中的图片和关闭按钮不显示 显示,离开时,以slow速度隐藏 单击常见问题分类下的一级菜单时,使用slideDown()方法实现二级菜单以slow速度显示,当再次单击一级菜单时,使用slideUp()方法已slow速度隐藏 关键代码...,选择所属板块,输入帖子内容 单击“发布”按钮,新发布的帖子显示在列表的第一个,新帖子显示头像,标题,板块和发帖时间 关键代码: ...星级显示功能,当选择对应的分数时以星级形式显示调查结果, 结果一栏以图片显示 删除功能, 点击“删除”按钮后提示“是否删除?”

    8.8K10

    C#学习笔记—— 常用控件说明及其属性、事件

    (10)MaximizeBox属性:用来获取或设置一个值,该值指示是否在窗体的标题栏中显示最大化按钮。值为 true时显示最大化按钮,值为false时不显示最大化按钮。...(11)MinimizeBox 属性:用来获取或设置一个值,该值指示是否在窗体的标题栏中显示最小化按钮。值为 true时显示最小化按钮,值为false时不显示最小化按钮。...(12)AcceptButton 属性:该属性用来获取或设置一个值,该值是一个按钮的名称,当按 Enter 键时就相当于单击了窗体上的该按钮。...(13)CancelButton 属性:该属性用来获取或设置一个值,该值是一个按钮的名称,当按 Esc 键时就相当于单击了窗体上的该按钮。...(2)Hexadecimal:获取或设置一个值,该值指示该控件是否以十六进制格式显示所包 含的值。 (3)Increment:获取或设置单击向上或向下按钮时,该控件递增或递减的值。

    14.6K20

    Qt编写自定义控件17-按钮进度条

    一、前言 按钮进度条,顾名思义,表面上长得像一个按钮,单击以后切换成进度条指示按钮单击动作执行的进度,主要用在一些需要直接在按钮执行动作显示对应进度的场景,在很多网页中经常看到这种效果,这个效果有个优点就是直接在原地显示进度条...二、实现的功能 1:可设置进度线条宽度+颜色 2:可设置边框宽度+颜色 3:可设置圆角角度+背景颜色 三、效果图 [在这里插入图片描述] 四、头文件代码 #ifndef PROGRESSBUTTON_H...#define PROGRESSBUTTON_H /** * 按钮进度条控件 作者:倪大侠(QQ:393320854 zyb920@hotmail.com) 2019-4-17 * 1:可设置进度线条宽度...QColor bgColor; //背景颜色 double value; //当前值 int status; //...远超qwt集成的控件数量。 每个类都可以独立成一个单独的控件,零耦合,每个控件一个头文件和一个实现文件,不依赖其他文件,方便单个控件以源码形式集成到项目中,较少代码量。

    1.8K00

    Ajax在jQuery中应用--jQuery基础知识点(5)

    传统的JavaScript方法实现Ajax功能 var objXmlHttp = null; //声明一个空的XMLHTTP变量 function CreateXMLHTTP() {...$("#frmUserLogin").html(HTML); //将页面内容置入表单 $("#btnLogin").click(function() { //“登录”按钮单击事件...type: "GET", url: "UserInfo.xml", dataType: "xml" }) $("#Button1").click(function() { //"姓名”按钮的单击事件...//显示"姓名"部分 } }) }) $("#Button2").click(function() { //"性别”按钮的单击事件 $.ajax({ success...前者是当请求开始执行时触发,往往用于编写一些准备性的工作,如提示“正在获取数据...”字样;后者是当请求结束时触发,在这一事件中,常常与前者配合,说明请求的最后进展状态,如将显示中的“正在获取数据...

    2.8K32

    JavaScript入门

    设置按钮绑定单击事件:获取左侧用户输入的数据,显示到右侧; 下拉菜单选中不同的选项,更换不同的风格(css) // 按钮 var oSetcard = document.getElementById...2、显示数据 == 获取每个表单控件的value属性值,把这个值显示 -- 找到标签保留标签和类的基础上替换文字即可 // alert(oInp01.value).../1/2) -- 命令:右侧区域的class属性换值 4、 为空的判断 – if :获取value==‘’,执行命令报错提示用户alert + return 按钮绑定单击事件:获取左侧用户输入的数据,显示到右侧; 下拉菜单选中不同的选项,更换不同的风格(css) // 按钮 var oSetcard = document.getElementById...2、显示数据 == 获取每个表单控件的value属性值,把这个值显示 -- 找到标签保留标签和类的基础上替换文字即可 // alert(oInp01.value)

    3.6K20

    信息提醒之对话框(AlertDialog + ProgressDialog)-更新中

    ---- 带2个按钮(确认、取消)的对话框 显示这样的对话框的关键是如何显示两个按钮以及响应这两个按钮的单击事件。...这3个设置对话框按钮的方法虽然可以调用多次,但是系统只以每一个方法最后一次调用的为准。...进度条对话框除了要设置普通对话框必要的值外,还需要设置另外两个值:进度的最大值和当前的进度。...,其中进度条包含两个按钮“暂停”和 “停止”,单击暂停后,进度对话框关闭,再此显示进度对话框时,进度条的起始位置从上次关闭对话框的位置开始(仅限与水平进度条)。...消息代码可以是任意int类型的值 虽然ProgressDialog.getProgress可以获取当前进度,但是只有在水平进度条风格的对话框中才有效,如果是圆形进度条,该方法返回永远是0 。

    5.6K10

    一篇文章带你了解JavaScript弹出框

    JavaScript具有三种不同类型的弹出框:警告框,确认框和提示框。 一、警告框 警告框是最简单的弹出框。它使可以向用户显示一条短消息。还包括“确定”按钮,用户必须单击此“确定”按钮才能继续。...DOCTYPE html> 项目 单击按钮以显示警告弹出框:...确认框看起来类似于警报框,但其中包含“取消”按钮和“确定”按钮。 如果用户单击“确定”,则该框返回true。如果用户单击“取消”,则该框返回false。...三、提示框 如果希望用户在进入页面之前输入值,通常会使用提示框。提示框包括文本输入字段,“确定”和“取消”按钮。 如果用户单击“确定”,则该框将返回输入值。...DOCTYPE html> 项目 单击按钮以显示提示框: <

    2.6K30

    java表单提交方法_表单提交的几种方式

    使用或都可以定义提交按钮,只要将其特性的值设置为“submit”即可,而图像按钮则是通过的type特性值设置为”image”来定义的。因此,只要我们单击一下代码生成的按钮,就可以提交表单。...5、在JavaScript中,以编程方式调用submit()方法也可以提交表单。这种方式无需表单包含提交按钮,任何时候都可以正常提交表单。...来看一个例子: var form = document.getElementById(“myForm”); //提交表单 form.submit(); 在以调用submit()方法的形式提交表单时,不会触发...提交表单时可能出现的最大问题,就是重复提交表单。在第一次提交表单后,如果长时间没有反映,用户可能会变得不耐烦。这时候,他们也许会反复单击提交按钮。...解决这一问题的办法有两个: 在第一次提交表单后就禁用提交按钮; 利用onsubmit事件处理程序取消后续的表单提交操作。 版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。

    7.2K40

    DOM和事件和BOM的学习

    #DOM的简单学习文档对象模型(Document Object Model,简称DOM) 功能:控制html文档的内容 *代码:获取页面标签(元素)对象,Element *Document.getElementByid...("id值"):通过元素的id获得元素对象 *操作Element对象: 1.设置属性值: 1.1明确获取的对象是哪一个, 1.2查看API文档,找其中有哪些属性可以设置...Location:地址栏对象 Window:窗口对象 1.创建 2.方法 1.与弹出框有关的方法: alert()显示带有一段消息和一个确认按钮的警告框 confirm...()显示带有一段消息以及确认按钮和取消按钮的对话框。...*事件:某些操作,如:单击,双击,键盘按下了,鼠标移动了。 *事件源:组。如:按钮 文本输入框。。。 *监听器:代码。 *注册监听:将事件,事件源,监听器结合在一起。

    2.1K30

    番茄钟番外版:用游戏化元素提高工作效率!

    JavaScript逻辑// 获取页面元素const timeLeftDisplay = document.getElementById("time-left");const progressBar =...代码解析HTML部分我们的HTML结构包含了计时器、进度条、任务输入框以及添加任务的按钮。每次用户点击“开始工作”时,番茄钟将开始计时。任务输入框用于添加用户的任务,任务列表则会展示当前的任务。...CSS部分通过CSS,我们设置了计时器的样式,使进度条和时间显示更加直观,同时添加了一些简单的动画效果。还为按钮、任务输入框和任务列表提供了简单的样式。...JavaScript部分计时与倒计时:通过setInterval()函数每秒更新一次剩余时间,并更新进度条。任务管理:用户可以添加任务,所有任务都会动态显示在任务列表中。...游戏化反馈:每个番茄时段结束时,会显示幽默的反馈语和奖励,增强趣味性。5. 结论这个简单的番茄钟游戏化工具通过引入进度条、任务管理和幽默反馈,极大地提升了工作时的趣味性与互动性。

    34711
    领券