首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Tkinter:为什么在触摸移动的蓝色矩形时,矩形仍然是黄色的?

在Tkinter中,如果在触摸移动的蓝色矩形时,矩形仍然是黄色的,这通常是因为事件绑定或状态更新的问题。以下是可能的原因和解决方法:

基础概念

Tkinter是Python的标准GUI库,用于创建图形用户界面应用程序。它提供了多种组件,如按钮、标签、文本框和画布等。画布(Canvas)组件允许你在窗口上绘制图形,并对这些图形进行交互操作。

可能的原因

  1. 事件绑定问题:可能没有正确绑定触摸移动事件(如<B1-Motion>)到画布上的矩形。
  2. 状态更新问题:可能在事件处理函数中没有正确更新矩形的颜色状态。
  3. 绘制顺序问题:可能在绘制新矩形时没有清除旧矩形,导致视觉上看起来矩形颜色没有变化。

解决方法

以下是一个示例代码,展示如何正确绑定事件并更新矩形的颜色:

代码语言:txt
复制
import tkinter as tk

class App:
    def __init__(self, root):
        self.root = root
        self.canvas = tk.Canvas(root, width=400, height=400)
        self.canvas.pack()
        
        self.rectangle_id = None
        self.is_blue = False
        
        self.canvas.bind("<Button-1>", self.on_button_press)
        self.canvas.bind("<B1-Motion>", self.on_move_press)
    
    def on_button_press(self, event):
        # 清除之前的矩形
        if self.rectangle_id:
            self.canvas.delete(self.rectangle_id)
        
        # 创建一个新的蓝色矩形
        self.rectangle_id = self.canvas.create_rectangle(event.x - 25, event.y - 25, event.x + 25, event.y + 25, fill="blue")
        self.is_blue = True
    
    def on_move_press(self, event):
        if self.is_blue:
            # 更新矩形的颜色为黄色
            self.canvas.itemconfig(self.rectangle_id, fill="yellow")
            self.is_blue = False
        else:
            # 更新矩形的颜色为蓝色
            self.canvas.itemconfig(self.rectangle_id, fill="blue")
            self.is_blue = True

if __name__ == "__main__":
    root = tk.Tk()
    app = App(root)
    root.mainloop()

解释

  1. 事件绑定
    • <Button-1>:绑定鼠标左键按下事件到on_button_press函数。
    • <B1-Motion>:绑定鼠标左键按下并移动事件到on_move_press函数。
  • 状态更新
    • self.is_blue变量用于跟踪矩形的当前颜色状态。
    • on_move_press函数中,根据self.is_blue的状态更新矩形的颜色。
  • 绘制顺序
    • on_button_press函数中,清除之前的矩形,确保每次按下鼠标左键时只绘制一个新的矩形。

参考链接

通过以上方法,可以确保在触摸移动矩形时,矩形的颜色能够正确地在蓝色和黄色之间切换。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

CoordinatorLayout使用如此简单

稍微解释一下这个动画,蓝色矩形是我们一个普通View,黄色Hello是一个Button。我们水平拖动蓝色矩形黄色Button沿着与蓝色矩形相反方向移动;竖直移动蓝色矩形黄色也跟着竖直。...简而言之:它们竖直方向同步移动水平方向相反。...如果我们想要实现功能是,有更多View要根据蓝色View移动相应作出响应,那么那就得蓝色ViewonTounchEvent里面针对其他View处理各种逻辑。...而Dependency是指Child依赖View。比如上面的gif图中,蓝色View就是Dependency,黄色View就是Child,因为黄色View动作是依赖于蓝色View。...有了上面的概念后,我们看看具体怎么去实现吧~ 为了响应跟随手指移动操作,我们定义一个非常简单View,这个View只响应跟随手指移动,将这个View作为Dependency。

747100

【Android UI】Canvas 画布 ⑨ ( Canvas 绘图坐标系平移实例 )

(111, 111); Canvas 自身坐标系 范围就是 黄色范围 , Canvas 绘图坐标系 初始与黄色范围重合 , 因此初始位置绘图蓝色矩形 , 其左上角与 Canvas 自身坐标系 原点重合...; Canvas 平移后 , 画布向右下角移动 , Canvas 绘图坐标系就是下图中红色范围 ; 下面的 组件 背景是黄色 , 黄色范围就是组件轮廓 , 初始位置绘制蓝色矩形如下 ,...其左上角 与 Canvas 自身坐标系 , Canvas 绘图坐标系 原点 重合 ; Canvas 平移后 , 绘制红色矩形 , 其 绘图坐标系原点 就是 红色矩形 左上角位置 ; 如果要终止该...Canvas 自身坐标系中绘图 , 则调用 Canvas#restore 方法 , 将 Canvas 绘图坐标系恢复到初始位置 , 也就是恢复到下图样式 ; 蓝色是 Canvas 绘图坐标系 , 黄色是...(); } } 展示效果 : 黄色部分是 组件范围 , 蓝色矩形是 第一次绘制 , 红色矩形是 Canvas 画布平移后 第二次绘制 ;

89720
  • Android自定义系列——6.PorterDuffXfermode

    ()Canvas上绘制了一个透明矩形,由于Activity本身屏幕背景白色,所以此处就显示了一个白色矩形。...我们只是将绘制圆形与矩形代码放到了canvas.saveLayer()和canvas.restoreToCount()之间,为什么不再像示例二那样显示白色矩形了?...这样当将新layer绘制到Canvas上,完全不透明3/4黄色圆中像素会完全覆盖Canvas对应位置像素,而由于新layer上面绘制矩形区域像素ARGB都为(0,0,0,0),所以最终Canvas...中值为SRC,API Demo中肉眼看到结果是绘制黄色圆形完全不可见,绘制蓝色矩形完全可见,其实这是不对,因为如果makeDst()、makeSrc()方法所得到Bitmap实际大小与所画圆...、矩形实际大小相同,那么效果应该是所绘制黄色圆形可见,所绘制蓝色矩形也可见,只不过圆形和矩形相交区域是蓝色,即正确效果应该是蓝色矩形压盖了黄色圆形。

    85020

    scetch入门 第2部分:文本,对齐和SVG第3部分中了解如何导出文件

    显示所有图层 由于我本教程中对艺术家给予了赞誉,因此我通过点击删除来删除嵌入文本图层。当您使用他人作品,请确保在下载始终给予奖励或付费。 ? 打开图层 现在是时候做一些侦探工作了。...您必须选择组中三个单独图层才能编辑颜色! 现在你有一只浅蓝色猴子。要调整大小,请按住shift并将光标移动到形状角落。 ? 调整图层大小 在按住shift同时,拖动图像一角直到它变大。...请务必更改每个屏幕画板名称,因为这是Sketch导出PNG将使用名称! 共享样式和文本样式 共享样式允许您一次更改多个图层样式。要了解其工作原理,首先从任何画板中选择一个蓝色矩形。...顶部矩形共享样式 现在选择第二个画板中另一个蓝色矩形并应用“顶部矩形”样式。 ? 选择其他矩形 现在,这部分很重要:确保只选择了一个矩形,而不是两个。编辑填充到#F5C923。 ?...应用风格 如您所见,已应用“Sock Monkey”样式,将我们图标从蓝色更改为黄色第3部分中了解如何导出文件 原文:http://megumi.co/learn/sketch2.htm

    4.1K30

    【十分钟】学会微信小游戏,攀登不止小游戏制作(IVX 快速开发教程十一)

    设置事件为触碰触发,触发后为矩形边路进行赋值: 在此我们将该矩形背景色更改为红色,在此我们规定:红色矩形目标值为1、橙色矩形目标值为2、蓝色矩形目标值为3、绿色矩形目标值为4。...,让其有辨识度: 接下来在对应矩形事件中,将对触碰矩形变量赋值动作值按照橙色矩形目标值为2、蓝色矩形目标值为3、绿色矩形目标值为4 规则进行修改,在此以橙色矩形事件为例:...11.3 完成小球移动 此时我们需要将小球移动黄色矩形块上演示黄色矩形块不进行跳动。在此我们在前台添加事件,当鼠标或手指按下某个位置使小球朝着该方向平移。...我们先创建一个变量命名为按下x,该变量用于记录按下 x 坐标: 之后事件中为其赋值: 完成后,我们判断按下位置小球左侧还是右侧,若在左侧小球则往左侧移动,若在右侧小球则往右侧移动。...,当小球进行一次跳跃我们就为其分数加一: 触发器小球跳跃事件中,添加动作将分数进行增加: 我们再到前台中创建两个文本,用于分数显示,并且分数增加动作中设置一个文本内容为分数变量

    1.3K30

    基于Python+Tkinter实现一个贪食蛇小游戏

    你是否还记得那个时代,当我们手机还没有触摸屏,游戏也只有像“贪食蛇”这样经典款?当时,许多人都沉迷于控制一条小蛇吃食物乐趣中。...例如,我们游戏界面是一个宽600像素、高400像素矩形,食物和蛇大小都是20像素。2. 游戏核心元素贪食蛇游戏核心其实很简单:一个能够四处移动蛇,和它要追逐食物。...用Python和Tkinter实现首先,我们需要使用PythonTkinter库来创建游戏图形界面。a. 创建主窗口root = tk.Tk()root.title("贪食蛇")b....游戏循环游戏循环是贪食蛇游戏核心。每次循环中,我们需要:检查蛇是否撞到了墙壁或自己身体。移动蛇。检查蛇是否吃到了食物。重新绘制蛇和食物。d....结束游戏当蛇撞到墙壁或自己身体,我们需要结束游戏,并给出“游戏结束”提示。5.

    48630

    tkinter -- Canvas(1)

    提供可以用来进行绘图 Container,支持基本几何元素,使用 Canvas 进行绘图,所有的操作都是通过 Canvas,不是通过它元素 元素表示可以使用 handle 或 tag 第一个Canvas...为明显起见,将背景色设置为白色,用以区别 root 指定 item 填充色 创建一个矩形,指定画布背景色为白色 使用属性 fill 设置它填充颜色 代码: import tkinter as tk...指定 item 边框颜色 创建一个矩形,指定画布背景色为白色 使用属性 outline 设置它边框颜色 代码: import tkinter as tk root = tk.Tk() # 创建一个...指定矩形边框颜色为红色,设置线宽为5,注意与 Canvas width 是不同 画虚线 指定画布背景色为白色 使用属性 dash,这个值只能为奇数 代码: import tkinter as...指定矩形边框颜色为红色,自定义画刷 修改 item 坐标 指定画布背景色为白色 使用 Canvas 方法来重新设置 item 坐标 代码: import tkinter as tk root

    74230

    结构建模设计——Solidworks软件之草图绘制基础图形工具总结(绘制直线、矩形、圆、槽、圆弧、圆角等)

    ) ——此时不能再点击水平了(二者属性本身就是对立,若选上了,可以设计树中删除) ——点击固定,可以固定直线无法拖动 ——端点还是蓝色,说明也可以动,点击端点,选择固定属性,也就固定约束了。...——草图绘制区域,左键点击确定第一个端点,此时移动鼠标,点击确定第二个端点,矩形就画出来了 ——添加尺寸,草图选项卡中选择智能尺寸按钮,或者按住鼠标右键,向上滑动即可选择该智能尺寸标注功能 ——添加矩形长和高...、第一个端点相对构造线尺寸约束 ——滚动滚轮放大或缩小查看,或按住Ctrl+鼠标中键,移动画面查看 ——其他类型矩形画法差异不大,可以自行摸索下 1.3 绘制圆 ——草图绘制工具中,选择绘制中心圆...,通过点击圆心位置完成约束 1.4 绘制槽 ——草图绘制工具,选择直槽口(鼠标放在该工具上方,会有简单使用方法提示) ——草图上,鼠标左键点击第一个点确定第一个圆心,然后鼠标可以水平或垂直移动,此时槽口方向会自定义为水平或垂直...1.6 绘制圆角及倒角 ——草图绘制工具,选择圆角,点击刚刚绘制矩形一个端点,鼠标移至端点可以看到黄色预览 ——点击端点,左侧属性中可以设置圆角参数,点击确定生效 ——同样,可以选择绘制倒角,参数通用可以设置

    2.4K20

    (译)SDL编程入门(8)几何图形渲染

    另外,请注意,我们每一帧都用SDL_SetRenderDrawColor将清除颜色设置为白色,而不是初始化函数中设置一次。我们将在主循环结束介绍为什么会发生这种情况。...这里我们设置矩形x方向上宽度为屏幕宽度四分之一,y方向上高度为屏幕高度四分之一,而且宽度/高度为屏幕一半。...定义好矩形区域后,我们用SDL_SetRenderDrawColor设置渲染颜色。这个函数接收了我们使用窗口渲染器和我们要渲染颜色RGBA值。R是红色组件,G是绿色,B是蓝色,A是alpha。...所以当我们渲染实体矩形,坐标系功能是这样: ? 还有一点要知道是,SDL从左上角渲染矩形、表面和纹理。 下面是使用SDL_RenderDrawLine[4]绘制一条像素细线代码。...如果没有这个调用,那么屏幕就会用上次用 SDL_SetRenderDrawColor 设置任何颜色来清除,本例中就会产生黄色背景。 这里[7]下载本教程媒体和源代码。

    1.4K30

    canvas详细教程! ( 近1万字吐血总结)

    ,不属于图像: 这里解释以下为什么图像呈现出来是这样:我们画天蓝色时候,globaoCompositeOperation参数是source-over,所以会全部画出来,但是又因为下一个绘制浅黄色参数是...source-out,所以浅黄色圆只会显示和浅蓝色圆重叠之外部分,且浅蓝色圆会变透明,继续画第三个粉色圆,粉色圆只会与画出已有浅黄色圆重叠之外部分,故得到如图所示结果。...示例: 之前讲过,如果我们这样画出来两个矩形,那么这两个矩形颜色都将是天蓝色,透明度50%, </canvas...100像素,y轴正方向移动了150像素 ctx.fillRect(0, 0, 200, 100); 蓝色矩形绘制坐标还是(0,0)点,但是在此之前移动了原点位置,所以视觉上矩形位置是...在上边代码中,我两个save()中间加了一个修改填充颜色为pink代码,观察下图中更改颜色矩形方块是哪几个: 可以看到,更改颜色是旋转和移动原点坐标的两个矩形,而缩放矩形颜色并未修改,

    3.4K12

    tkinter)撩妹弹窗(3)之不要越过三八线,canvas使用方法

    弹窗已经实现了,现在,我们来以桌面中心线为中心,当弹窗左边显示一个颜色,当弹窗右边,显示一个颜色。...渐变:逐渐改变,到达某一条线,中间会显示这条分界线,逐渐变为另外一个。 思考:刚开始编写,我尝试了使用弹窗标签label,但是似乎不如人意,但也是勉强实现了突变。...当窗口所在坐标超过屏幕二分之一,变为蓝色。 也就是我们需要知道屏幕2分之一位置,以及窗口坐标的位置,集合到之前我们学习到知识,因此就可以得到。...宽计算等于多少呢? width=w/2-x w为屏幕宽,x为坐标的x,也就是窗体位置坐标横坐标。然后就得到矩形宽。窗口高即为矩形高,也是就得到了这个变化。...五、总结 阅读本文,主要了解是,tkinter画布功能。画布创建,画矩形方法,插入文字方法,插入图片方法。以及tkinter窗口改变事件应用。

    1.6K30

    软件测试|超好用超简单Python GUI库——tkinter(十五)

    该选项值可以为:"butt"(线段两段平切于起点和终点)"projecting"(线段两段起点和终点位置将 width 选项设置长度分别延长一半)"round"(线段两段起点和终点位置将...指定当点画模式填充位图偏移smooth默认值为 False,若设置为 True,表示将以曲线样式代替所绘线段splinesteps当绘制曲线,该选项指定由多少条折线来构成曲线,默认值是 12,...绘制这些图形相关函数可选参数与上述表格也存在略微差异,下面以绘制扇形 create_arc() 函数为例做简单介绍:属性方法activedash当画布对象状态为 "active" 时候,绘制虚线...()运行程序,结果如下所示:图片注:create_rectangle() 方法前两个参数决定了矩形左上角坐标,后两个参数决定了矩形右下角坐标;另外 create_oval() 方法并不是只能绘制圆形...画布控件绘制多种图形方法,还包括展示文字内容方法,后续我们将介绍tkinter菜单控件使用。

    62110

    CorelDRAW 2019,软件应用项目(二)

    目录 认识个人名片和企业名片 制作名片大小 简要制作名片要点 制作名片 圆角矩形应用 为什么小空间内不能填充 文字工具 导出作品 复制代码 一.认识个人名片和企业名片...二.制作名片 圆角矩形应用 我们点击矩形工具,绘制一个和新建纸张一样大小矩形可以空格切换为移动工具,微调矩形大小 在上面有三个按键一个是往里凹,一个是往外凹,还有一个是平角旁边数值可以调整,它们大小中间一把锁...鼠标左键点击色块填充颜色 为什么小空间内不能填充 (接下来是错误示范)我们点击矩形图层进行转曲,这样举行就会变成曲线,我们利用钢笔工具,不断建立锚点曾晓明那一波了矩形中建立一根根单独成立直线,我们将所有的曲线图层合并...,空格键转为移动工具再次点击曲线,你会看到所有曲线路径貌似已经全部闭合了但是你单机词会时或者用吸管工具吸取颜色,再用油漆桶工具填充,都只会在整个矩形内填充不会在被其他曲线隔开不规则图形中填充我也曾试过用过剃刀工具...,我们可以选择一个黄色,我们用鼠标右键单击最顶端带有斜杠色块,这样填充了黄色,删除了描边。

    1.6K20

    图片操作系列 —(1)手势缩放图片功能

    ScaleToFit 有如下四个值: FILL: 可能会变换矩形长宽比,保证变换和目标矩阵长宽一致。 START:保持坐标变换前矩形长宽比,并最大限度填充变换后矩形。至少有一边和目标矩形重叠。...CENTER: 保持坐标变换前矩形长宽比,并最大限度填充变换后矩形。至少有一边和目标矩形重叠。 END:保持坐标变换前矩形长宽比,并最大限度填充变换后矩形。至少有一边和目标矩形重叠。...这里使用谷歌api demo图片作为例子: ? 我们很明显发现,那个蓝色小球变化不就是我们想要变化么,并且我们是要居中,所以用是Matrix.ScaleToFit.CENTER。...如果没有超过,我们可以看到我们希望图片放大和缩小都是希望正中间位置,但是现在变成了绿色地方,我们只需要把绿色地方移动到咖啡色地方就行。 以Y轴为例(X轴同样处理): ?...因为这时候不能反而不让他中心位置,为什么????我们现在图片是一个安卓机器人,比如我现在要放大它图片查看它右眼,我们右上角用手机不挺放大。变成这样: ? 这时候就说了。

    3.1K10

    自定义View进阶路:绘制饼图

    计算外接矩形距屏幕左上右下; ? 计算外接矩形,也就是计算移动到屏幕中心。而我们就是要计算扇形组成圆形外接矩形左上右下距离。...( )一起使用时,恢复到canvas.save( )保存状态        canvas.restore();    } 获取外接矩形左上右下坐标点 关于获取左上右下坐标点时候,需要注意,由于我们获取是屏幕二分之一大小...这里为大家简单说明一下为什么会出现刚才那样原因。...当我们第一次绘制扇形时候,Path中记录了当前属性,也就是颜色值,绘制下一个扇形时候,由于Path中依然缓存或者说是记录第一次属性值,造成后果就是我们看到一个颜色大圆形。...我们饼图点击效果是用户所点击扇形区域稍微往外面延伸了部分,如上图蓝色区域。

    72020

    最简单方式构建 Tkinter 图形界面

    为什么要图形界面呢?...前文最简单方式发布你Python应用中提到,程序员写软件,最好给不懂技术的人使用,才更有价值,我们平时写 Python 程序,都是一个叫作终端黑窗口里运行,自己用当然没问题,给别人用,尤其是不懂技术的人...如果没有,就不会有今天文章了。 总的来说,分三步: 第一步:设计界面。 Figma 网站上通过拖拉拽方式设计好图形界面,不想自己设计也行,有别人设计好,你可以直接使用,有些免费,有些付费。...基本流程就是选择一个 Frame,在上面拖拉一些图片,文本,矩形框,配置颜色,矩形框可以设计成文本输入框,也可以做成按钮,非常灵活。...PS:公众号底部菜单-我->我留言,点击可以跳转,点击蓝色文章标题,可以跳转文章,从而找到自己留过言文章。

    4.2K20

    腾讯地图JavaScript API GL实现文本标记碰撞避让

    需求场景 用户地图上实现MultiLabel文本标注覆盖物,会由于两个label坐标过近,或者地图旋转、缩放产生变化而相互重叠。...确定算法 JSAPI GL中,label并不是在三维空间中,而是绘制屏幕上,只是会根据用户视角移动实时计算出label屏幕坐标中所处位置,然后每一帧中进行绘制。...如上图所示,蓝色线段为左边矩形半径投影,黄色线段为右边矩形检测轴。...我们需要把右边2条检测轴投影到蓝色线段所在X轴单位向量(即左边矩形检测轴单位向量),得到投影比例,然后乘以检测轴长度(即矩形长、宽一半),可计算出右边矩形半径投影。...红色线段则是两个矩形中心点连线,同样需要计算它在蓝色线段所在X轴投影长度,如果中心点连线投影长度大于两个矩形半径投影之和,那么在这条轴上两个矩形没有碰撞,否则发生碰撞。

    1.5K40

    “疫”外求职 | Treemap绘制COVID-19阵列图

    本例中,中间黄色被赋值为(-3.50 + 11.47)/ 2,即3.99。...custom type mapping 指定mapping参数,“value”和“manual”treemap类型是相同。假设我们把-5赋值给红色,5赋值给黄色,15赋值给蓝色: ?...图4 几乎所有的值和图例,都映射到调色板左侧,也就是红色和黄色之间,少量数据黄色蓝色之间,要查看图例中完整映射,使用“range”参数。 ?...vColor:确定矩形颜色,以Data数据集中列cum_dead,累计死亡人数进行赋值。 type:矩形颜色方案,此处选择index,此外还有comp、depth等。...aspRatio:是指主矩形宽度/高度比值。 palette:调色板,采用##RRGGBB格式选取配色, 颜色不同代表数据不同,包括HCL、RColorBrewer调色板。

    67451

    Cocos Creator基础教程(11)—可拖拽组件

    而且组件完成后,测试场景最好也不要丢弃了,等我们以后为组件升级或修改BUG,可用于快速检验修改是否正确。 ? 初始化工程 2....(location); } }); 代码主要是设置节点触摸监听,监听事件中修改节点位置。..._oldPosition; } }); 代码变复杂了,简单说明一下: 是增加了一个target节点属性,他是节点要移动目标 增加TOUCH_END事件,当手指抬起,检查当前节点是否目标节点之中...小结 这次主要运用了节点触摸事件监听,触摸事件touchEvent参数中获取当前触摸坐标点。...同时还有使用了最简单碰撞检测函数rect.contains(Cocos Creator 1.9.3之前用cc.rectContainsPoint),检查一个坐标点是否矩形内。

    4.7K31
    领券