Hello, I'm trying to create a progress dialog that shows a progress value from 0 to 100 %. Doing some research I found out that ProgressDialog() with CancelableProgressorSource() is able to serve this. My current setting is as follows: public async void ComponentChangedHandler ( Component selectedComponent ) { using ( var progress = new ProgressDialog ( "Start Work" ) ) { var status = new CancelableProgressorSource ( progress ) ; status . Progressor . Max = 100 ; progress . Show ( ) ; await QueuedTask . Run ( ( ) = > { uint step = 0 ; foreach ( var dateRange in dateRanges ) { DoSomeLongWork ( ) ; step + = 10 ; status . Progressor . Value = step ; } } , status . Progressor ) ; progress . Hide ( ) ; } } This way I'm getting a nice progress dialog with my dialog message and a bar animation spinning from left to right and back again. What I want is a progress bar filling up from left to right increasing percent progress by 10 in each iteration step. What am I missing here?

When you create the ProgressDialog you have to specify the max steps in the constructor. Like this: protected override async void OnClick ( ) { using ( var progress = new ProgressDialog ( "Showing Progress" , "Canceled" , 100 , false ) ) { var status = new CancelableProgressorSource ( progress ) ; status . Max = 100 ; progress . Show ( ) ; await QueuedTask . Run ( async ( ) = > { uint step = 0 ; for ( var idx = 0 ; idx 10 ; idx ++ ) { await Task . Delay ( 1000 ) ; status . Progressor . Value + = 10 ; status . Progressor . Status = ( status . Progressor . Value * 100 / status . Progressor . Max ) + @" % Completed" ; status . Progressor . Message = "Message " + status . Progressor . Value ; } } , status . Progressor ) ; progress . Hide ( ) ; } } There is also a sample available showing an implementation: https://github.com/esri/arcgis-pro-sdk-community-samples/tree/master/Framework/ProgressDialog

nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Create a ProgressDialog with ProgressBar

RichardReinicke

Hello,

I'm trying to create a progress dialog that shows a progress value from 0 to 100 %.

Doing some research I found out that ProgressDialog() with CancelableProgressorSource() is able to serve this. My current setting is as follows:

<SPAN class="keyword token">public</SPAN> <SPAN class="keyword token">async</SPAN> <SPAN class="keyword token">void</SPAN> <SPAN class="token function">ComponentChangedHandler</SPAN><SPAN class="punctuation token">(</SPAN>Component selectedComponent<SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">{</SPAN>
    <SPAN class="keyword token">using</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">var</SPAN> progress <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">ProgressDialog</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"Start Work"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN>
    <SPAN class="punctuation token">{</SPAN>
        <SPAN class="keyword token">var</SPAN> status <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">CancelableProgressorSource</SPAN><SPAN class="punctuation token">(</SPAN>progress<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Max <SPAN class="operator token">=</SPAN> <SPAN class="number token">100</SPAN><SPAN class="punctuation token">;</SPAN>
        progress<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Show</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

        <SPAN class="keyword token">await</SPAN> QueuedTask<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Run</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">=</SPAN><SPAN class="operator token">></SPAN>
        <SPAN class="punctuation token">{</SPAN>
            <SPAN class="keyword token">uint</SPAN> step <SPAN class="operator token">=</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
            <SPAN class="keyword token">foreach</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">var</SPAN> dateRange <SPAN class="keyword token">in</SPAN> dateRanges<SPAN class="punctuation token">)</SPAN>
            <SPAN class="punctuation token">{</SPAN>
                <SPAN class="token function">DoSomeLongWork</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
                step <SPAN class="operator token">+</SPAN><SPAN class="operator token">=</SPAN> <SPAN class="number token">10</SPAN><SPAN class="punctuation token">;</SPAN>
                status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Value <SPAN class="operator token">=</SPAN> step<SPAN class="punctuation token">;</SPAN>
            <SPAN class="punctuation token">}</SPAN>
        <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN> status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

        progress<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Hide</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">}</SPAN>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

This way I'm getting a nice progress dialog with my dialog message and a bar animation spinning from left to right and back again. What I want is a progress bar filling up from left to right increasing percent progress by 10 in each iteration step.

What am I missing here?

Trouver plus de publications taguées avec

Accepted answers

Wolf

When you create the ProgressDialog you have to specify the max steps in the constructor. Like this:

<SPAN class="keyword token">protected</SPAN> <SPAN class="keyword token">override</SPAN> <SPAN class="keyword token">async</SPAN> <SPAN class="keyword token">void</SPAN> <SPAN class="token function">OnClick</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">{</SPAN>
    <SPAN class="keyword token">using</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">var</SPAN> progress <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">ProgressDialog</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"Showing Progress"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"Canceled"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">100</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN>
    <SPAN class="punctuation token">{</SPAN>
        <SPAN class="keyword token">var</SPAN> status <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">CancelableProgressorSource</SPAN><SPAN class="punctuation token">(</SPAN>progress<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        status<SPAN class="punctuation token">.</SPAN>Max <SPAN class="operator token">=</SPAN> <SPAN class="number token">100</SPAN><SPAN class="punctuation token">;</SPAN>
        progress<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Show</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

        <SPAN class="keyword token">await</SPAN> QueuedTask<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Run</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">async</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">=</SPAN><SPAN class="operator token">></SPAN>
        <SPAN class="punctuation token">{</SPAN>
            <SPAN class="keyword token">uint</SPAN> step <SPAN class="operator token">=</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
            <SPAN class="keyword token">for</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">var</SPAN> idx <SPAN class="operator token">=</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN> idx <SPAN class="operator token"><</SPAN> <SPAN class="number token">10</SPAN><SPAN class="punctuation token">;</SPAN> idx<SPAN class="operator token">++</SPAN><SPAN class="punctuation token">)</SPAN>
            <SPAN class="punctuation token">{</SPAN>
                <SPAN class="keyword token">await</SPAN> Task<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Delay</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="number token">1000</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
                status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Value <SPAN class="operator token">+</SPAN><SPAN class="operator token">=</SPAN> <SPAN class="number token">10</SPAN><SPAN class="punctuation token">;</SPAN>
                status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Status <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">(</SPAN>status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Value <SPAN class="operator token">*</SPAN> <SPAN class="number token">100</SPAN> <SPAN class="operator token">/</SPAN> status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Max<SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">+</SPAN> <SPAN class="string token">@" % Completed"</SPAN><SPAN class="punctuation token">;</SPAN>
                status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Message <SPAN class="operator token">=</SPAN> <SPAN class="string token">"Message "</SPAN> <SPAN class="operator token">+</SPAN> status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Value<SPAN class="punctuation token">;</SPAN>
            <SPAN class="punctuation token">}</SPAN>
        <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN> status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

        progress<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Hide</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

There is also a sample available showing an implementation: https://github.com/esri/arcgis-pro-sdk-community-samples/tree/master/Framework/ProgressDialog

All comments

Stefan_Offermann

Is there a way to see it also while deugging?

AnthonyDunkDatamineDev1

You cannot see the progress dialog if you run from the debugger.

DaveLewis73

I realize that this posting is rather old. However, I am running into a problem attempting to create a progress dialog. I have implemented the code suggested by Wolf and I get absolutely nothing. The task delay of 10 seconds works, but I do not see a progress dialog at all. I have tested this in two different add-ins, including one that was created just to test this functionality. I have also had a fellow team member test on another computer to no effect. In addition I have also checked out and tested with the code from the github link that was included by Wolf. Any thoughts? Am I missing something?

As an fyi, I am developing with ArcGIS Pro 2.9 (if that means anything).

Wolf

When you create the ProgressDialog you have to specify the max steps in the constructor. Like this:

<SPAN class="keyword token">protected</SPAN> <SPAN class="keyword token">override</SPAN> <SPAN class="keyword token">async</SPAN> <SPAN class="keyword token">void</SPAN> <SPAN class="token function">OnClick</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">{</SPAN>
    <SPAN class="keyword token">using</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">var</SPAN> progress <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">ProgressDialog</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"Showing Progress"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"Canceled"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">100</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN>
    <SPAN class="punctuation token">{</SPAN>
        <SPAN class="keyword token">var</SPAN> status <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">CancelableProgressorSource</SPAN><SPAN class="punctuation token">(</SPAN>progress<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        status<SPAN class="punctuation token">.</SPAN>Max <SPAN class="operator token">=</SPAN> <SPAN class="number token">100</SPAN><SPAN class="punctuation token">;</SPAN>
        progress<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Show</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

        <SPAN class="keyword token">await</SPAN> QueuedTask<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Run</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">async</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">=</SPAN><SPAN class="operator token">></SPAN>
        <SPAN class="punctuation token">{</SPAN>
            <SPAN class="keyword token">uint</SPAN> step <SPAN class="operator token">=</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
            <SPAN class="keyword token">for</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">var</SPAN> idx <SPAN class="operator token">=</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN> idx <SPAN class="operator token"><</SPAN> <SPAN class="number token">10</SPAN><SPAN class="punctuation token">;</SPAN> idx<SPAN class="operator token">++</SPAN><SPAN class="punctuation token">)</SPAN>
            <SPAN class="punctuation token">{</SPAN>
                <SPAN class="keyword token">await</SPAN> Task<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Delay</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="number token">1000</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
                status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Value <SPAN class="operator token">+</SPAN><SPAN class="operator token">=</SPAN> <SPAN class="number token">10</SPAN><SPAN class="punctuation token">;</SPAN>
                status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Status <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">(</SPAN>status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Value <SPAN class="operator token">*</SPAN> <SPAN class="number token">100</SPAN> <SPAN class="operator token">/</SPAN> status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Max<SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">+</SPAN> <SPAN class="string token">@" % Completed"</SPAN><SPAN class="punctuation token">;</SPAN>
                status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Message <SPAN class="operator token">=</SPAN> <SPAN class="string token">"Message "</SPAN> <SPAN class="operator token">+</SPAN> status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">.</SPAN>Value<SPAN class="punctuation token">;</SPAN>
            <SPAN class="punctuation token">}</SPAN>
        <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN> status<SPAN class="punctuation token">.</SPAN>Progressor<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

        progress<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Hide</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

There is also a sample available showing an implementation: https://github.com/esri/arcgis-pro-sdk-community-samples/tree/master/Framework/ProgressDialog

Rejoindre la conversation

Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.

Liens rapides

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.