时间戳

首页 > 解决方案 > 如何在kivy中制作圆形进度条？

python - 如何在kivy中制作圆形进度条？

问题描述

我想用 kivy 和 python 制作一个简单的圆形进度条。我搜索了在线文档和 GitHub 曲目，但没有找到解释循环进度条概念的正确示例。

就像下面附上的图片。我想发展。请任何人帮助我解决这个问题。在此处输入图像描述

标签： pythonprogress-barkivykivy-language

解决方案

新的，更好的版本

这篇文章受到的关注比我预期的要多，因此我决定花一点精力来创建这个小部件的升级版本。它现在在GitHub上可用。这是一个可以用它做什么的示例（进度条实际上是透明的，我在 gif 中添加了黑色背景以使所有内容可见）：

动画，更好的圆形进度条

如果有人感兴趣，我将保留旧帖子以供参考。

旧帖

我制作了一个小部件来代表您想要实现的目标。然而，有一些限制，确切地说：

  1. .value您需要调用该set_value方法，而不仅仅是使用 设置进度条值。我非常不确定应该做些什么来实现与原始ProgressBar课程相同的行为；

  2. 您必须指定大小才能实现圆形，因为对象本身就是椭圆。

这是代码，还有示例用法：

from kivy.app import App
from kivy.uix.progressbar import ProgressBar
from kivy.core.text import Label as CoreLabel
from kivy.lang.builder import Builder
from kivy.graphics import Color, Ellipse, Rectangle
from kivy.clock import Clock


class CircularProgressBar(ProgressBar):

    def __init__(self, **kwargs):
        super(CircularProgressBar, self).__init__(**kwargs)

        # Set constant for the bar thickness
        self.thickness = 40

        # Create a direct text representation
        self.label = CoreLabel(text="0%", font_size=self.thickness)

        # Initialise the texture_size variable
        self.texture_size = None

        # Refresh the text
        self.refresh_text()

        # Redraw on innit
        self.draw()

    def draw(self):

        with self.canvas:
            
            # Empty canvas instructions
            self.canvas.clear()

            # Draw no-progress circle
            Color(0.26, 0.26, 0.26)
            Ellipse(pos=self.pos, size=self.size)

            # Draw progress circle, small hack if there is no progress (angle_end = 0 results in full progress)
            Color(1, 0, 0)
            Ellipse(pos=self.pos, size=self.size,
                    angle_end=(0.001 if self.value_normalized == 0 else self.value_normalized*360))

            # Draw the inner circle (colour should be equal to the background)
            Color(0, 0, 0)
            Ellipse(pos=(self.pos[0] + self.thickness / 2, self.pos[1] + self.thickness / 2),
                    size=(self.size[0] - self.thickness, self.size[1] - self.thickness))

            # Center and draw the progress text
            Color(1, 1, 1, 1)
            #added pos[0]and pos[1] for centralizing label text whenever pos_hint is set
            Rectangle(texture=self.label.texture, size=self.texture_size,
                  pos=(self.size[0] / 2 - self.texture_size[0] / 2 + self.pos[0], self.size[1] / 2 - self.texture_size[1] / 2 + self.pos[1]))


    def refresh_text(self):
        # Render the label
        self.label.refresh()

        # Set the texture size each refresh
        self.texture_size = list(self.label.texture.size)

    def set_value(self, value):
        # Update the progress bar value
        self.value = value

        # Update textual value and refresh the texture
        self.label.text = str(int(self.value_normalized*100)) + "%"
        self.refresh_text()

        # Draw all the elements
        self.draw()


class Main(App):

    # Simple animation to show the circular progress bar in action
    def animate(self, dt):
        if self.root.value < 80:
            self.root.set_value(self.root.value + 1)
        else:
            self.root.set_value(0)

    # Simple layout for easy example
    def build(self):
        container = Builder.load_string(
            '''CircularProgressBar:
    size_hint: (None, None)
    height: 200
    width: 200
    max: 80''')

        # Animate the progress bar
        Clock.schedule_interval(self.animate, 0.1)
        return container


if __name__ == '__main__':
    Main().run()

输出：

动画圆形进度条

推荐阅读