如何在代号1中制作一个圆形的进度条？ [英] How to make a round Progress Bar in codename one?

问题描述

我想创建一个圆形的进度条，以百分比形式描述当前的状态。像这样：

现在我已经按照说明操作了

创建平坦进度栏，但由于我对挥杆并不熟悉，而且我也没有任何关于Java图形的线索，所以我不知道如何从'平板'转到'轮'进度条。

与进度栏相似的代码怎么样？ p：ps：我看到Hannahs在模拟时钟上发布消息并尝试它是这样的 - 但由于我在绘画（也可能是数学）方面的缺乏而失败。

$ b

pps：我根本不使用GUIBuilder

strong>（裸骨）

ppps：我希望它被绘制（如果可能），而不是基于图像的

 容器进度=新增Container（new LayeredLayout（））; 
标签百分比=新标签（0％）; 
 percent.getUnselectedStyle（）。setAlignment（Component.CENTER）; 
 progress.add（新标签（progressOverlayImage，Container））。 
 add（FlowLayout.encloseCenterMiddle（percent））; 
 progress.getUnselectedStyle（）。setBgPainter（（Graphics g，Rectangle rect） - > {
 g.setColor（0xff0000）; 
 g.fillArc（progress.getX（），progress。 getY（），progressOverlayImage.getWidth（），progressOverlayImage.getHeight（），0，currentProgress360）; 
}）; 
  

您需要以下内容才能使其发挥作用。

• 您需要在更改进度值时更新标签百分比


• 叠加图像在您希望显示进度的地方透明


• 您将需要一个名为 currentProgress360 的变量，它将表示当前0到360之间的进展情况

I want to create a round progress bar, depicting the current status in percent in its mid. like this:

now I already followed the instructions on creating a flat progress bar, but as I am not familiar with swing and I don't have any clue of Javas graphics, I have no clue how to transfer from the 'flat' to the 'round' progress bar.

How could a code similiar to the progress bar look like?

ps: I saw Hannahs post on the analog clock and tried it like this - but failed due to my lack in painting (and maybe mathematical) skills.

pps: I don't use the GUIBuilder at all (bare bones)

ppps: I want it to be drawn (if possible), not image-based

解决方案

I haven't tested it but something like this should work:

Container progress = new Container(new LayeredLayout());
Label percent = new Label("0%");
percent.getUnselectedStyle().setAlignment(Component.CENTER);
progress.add(new Label(progressOverlayImage, "Container")).
        add(FlowLayout.encloseCenterMiddle(percent));
progress.getUnselectedStyle().setBgPainter((Graphics g, Rectangle rect) -> {
    g.setColor(0xff0000);
    g.fillArc(progress.getX(), progress.getY(), progressOverlayImage.getWidth(), progressOverlayImage.getHeight(), 0, currentProgress360);
});

You will need the following to get this to work.

• You will need to update the percentage label when changing the progress value
• You will need an "overlay image" that is transparent where you want the progress to appear
• You will need a variable called currentProgress360 that will represent the current state of progress between 0 and 360

这篇关于如何在代号1中制作一个圆形的进度条？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！