Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

drawing animated level bar based on numbers

Posted on 2016-10-09
3
103 Views
Last Modified: 2016-10-12
i have this code that drawing steps level bar on Tvirtualstringtree

procedure TForm2.VirtualStringTree1BeforeCellPaint(Sender: TBaseVirtualTree;
  TargetCanvas: TCanvas; Node: PVirtualNode; Column: TColumnIndex;
  CellPaintMode: TVTCellPaintMode; CellRect: TRect; var ContentRect: TRect);

  procedure drawProgress(AWidth: Integer; APercent: Real; ASteps: Integer; ALeft: Integer = 1);
  var
    r: TRect;
    h, n: Integer;
  begin
    if APercent > 1 then
      APercent := 1
    else if APercent = 0 then
      Exit;//nothing to draw

    h := Round(CellRect.Height / ASteps) - 1;

    r.Top := CellRect.bottom - h - 1;
    r.Left := ALeft;
    r.Width := AWidth;

    TargetCanvas.Brush.Color := clSkyBlue;

    n := Ceil(APercent * ASteps);//how many rect to draw?

    while n > 0 do begin
      r.Height := h;
      TargetCanvas.FillRect(r);
      Dec(r.Top, 1 + h);
      Dec(n);
    end;
  end;

begin
  drawProgress(10,        1, 7);
  drawProgress(30, Percents, 7, 1 + 10 + 1);
end;

Open in new window


i take the code from Here

this code is drawing level bar based on this variable and animated it with timer but i got problem i am trying to set Percents variable to a random numbers start from 0 to 100 percent is real variable that set the level like that
Percents := Percents + 0.025; 

Open in new window

so i cannot set it to redraw the animated bar from 0 to 100 any idea how to tweak this ?

the goal is to set the bar from 0 - 50 - 100 and chanfe those number via timer to get the same result of this image but using numbers from 0 to 100 instead of using 0.025 to animated

http://i.stack.imgur.com/Cvt24.gif

var
  Percents: Real;

procedure TForm2.Timer1Timer(Sender: TObject);
begin
  if Percents > 1 then
    Percents := 0
  else
    Percents := Percents + 0.025;

  VirtualStringTree1.Repaint;
end;

Open in new window

0
Comment
Question by:dolphin King
  • 2
3 Comments
 
LVL 26

Expert Comment

by:Sinisa Vuk
ID: 41836609
As I can see you need to convert range of 0..100(integer) into 0..1 (float). So do conversion as:
Percents := Percents + PercInt/100;
where you can put PercInt to 50 (percent). Do you have problem to generate random numbers?
0
 

Author Comment

by:dolphin King
ID: 41836929
i have sound component that have level measure property like following

procedure TFORM1.SoundLevel(Sender: TObject; Level: Integer);
begin
// this Level  Value have maximum value that equals to 100
//so i needed to make the percents equals to that value to allow the tree redraw the animated level bar with the same value of the sound level 


end; 

Open in new window


currently by default the percent set randomly like so
global var 
Percents: Real;

//initiate percent

Percents := 0.2;

if Percents > 1 then
 begin
    Percents := 0.5;
 end
  else
  begin
    Percents := Percents + 0.025;
  end;

vstmca.Invalidate;

Open in new window


what i am trying to achieve to make percent equals to the sound level value the problem is that percent not completely set to actual integer that Percents is a decimal, not a percentage value, so 100% is 1.
0
 
LVL 26

Accepted Solution

by:
Sinisa Vuk earned 500 total points
ID: 41837553
...and when divide 100 with 100 you'll get 1.
function getSoundLevelPercentage(iLevel: Integer): Double;  
begin
  Result := iLevel/100;
end;

Open in new window

... where iLevel goes from 0 to 100, and result goes from 0.0 to 1.0
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article will show, step by step, how to integrate R code into a R Sweave document
When we want to run, execute or repeat a statement multiple times, a loop is necessary. This article covers the two types of loops in Python: the while loop and the for loop.
The viewer will learn how to use the return statement in functions in C++. The video will also teach the user how to pass data to a function and have the function return data back for further processing.
The viewer will be introduced to the technique of using vectors in C++. The video will cover how to define a vector, store values in the vector and retrieve data from the values stored in the vector.

856 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question