0

Below is my code for the progress bar:

<ProgressBar x:Name="Status_Bar" Width="1925" Height="30" 
    Canvas.Top="1191" Minimum="0" Foreground="#FFFFFFFF"
    Background="#FF919191" Canvas.Left="-3" >
</ProgressBar>

I am using it while playing a recording I want to mark tick on it when ever there is event comes in recording . I am adding a image reference for it.

Image Reference

As you can see the progress bar in the image has some colored ticks on it in orange and black. That's how I want to implement it

Peter Duniho
  • 68,759
  • 7
  • 102
  • 136
prabhat
  • 1
  • 1
  • ProgressBar does not support that. You need to build a custom control. – Prateek Shrivastava May 05 '20 at 05:47
  • By the way, if you set your code off in a separate "paragraph" from the rest of your question (nicely formatted) and then select the code and press the `{}` button in the editor, it will show up as formatted code in your question. – Flydog57 May 05 '20 at 05:52
  • 2
    The question is too broad. As you likely already now, the `ProgressBar` component does not have any mechanism for this built in. However, you can create your own user control that composes a `ProgressBar` in a `Canvas` and add appropriate elements for the tick marks. Alternatively (probably better) is to use an `ItemsControl` with the `ItemsPanel` set to a `Canvas`, and then use the `ItemsContainerStyle` to position the tick mark elements, using a template for the tick marks themselves. The `ProgressBar` and `ItemsControl` can be children of a `Grid`. – Peter Duniho May 05 '20 at 06:28
  • If the width and or height of the track can vary then you might find it easier to build the marks as a bitmapsource or drawingimage. Stretch an image so it automatically adapts to any dimension change. https://stackoverflow.com/questions/36298163/drawingcontext-drawrectangle-to-draw-a-rect – Andy May 05 '20 at 08:38
  • @PrateekShrivastava Can you explain it further. – prabhat May 05 '20 at 11:40
  • In addition to above suggestions it's possible to paint above `PrograssBar` with anything e.g. with `Rectangle`s or `Border`s collection, without `Canvas`. – aepot May 05 '20 at 20:27
  • None of the advices here would suffice IF you want to manually click/drag/swipe move on the ProgressBar and also would wan to Click on those Events in timeline. Firstly, check Slider control. https://learn.microsoft.com/en-us/dotnet/api/system.windows.controls.slider?view=netcore-3.1 -- next you will have to restyle it to look like what you need and also to Color code the Ticks. – Prateek Shrivastava May 05 '20 at 22:57

0 Answers0