how do i display loading bar for windows phone 8 a

2020-03-05 23:48发布

问题:

How do I invoke a load bar from within a view model? The cool one with the little dots that float by. I can't seem to find the right Bing phrase to search for it.

回答1:

Try this.

XAML

<phone:PhoneApplicationPage
...............>

    <phone:PhoneApplicationPage.DataContext>
        <local:ViewModel/>
    </phone:PhoneApplicationPage.DataContext>

    <shell:SystemTray.ProgressIndicator>
        <shell:ProgressIndicator IsIndeterminate="{Binding IsBusy}" 
                                 IsVisible="{Binding IsBusy}" 
                                 Text="{Binding Message}" />
    </shell:SystemTray.ProgressIndicator>

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--TitlePanel contains the name of the application and page title-->
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
            <TextBlock Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

        <!--ContentPanel - place additional content here-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Button Content="Show Progress" Command="{Binding _ShowProgressBar}" Height="100" />
        </Grid>
    </Grid>
</phone:PhoneApplicationPage>

C#

public class ViewModel : INotifyPropertyChanged
{
    private bool _IsBusy;
    public bool IsBusy
        {
            get { return _IsBusy; }
            set { _IsBusy = value; RaisePropertyChanged("IsBusy"); }
        }

    private string _Message;
    public string Message
        {
            get { return _Message; }
            set { _Message = value; RaisePropertyChanged("Message"); }
        }

    public RelayCommand _ShowProgressBar { get; set; }

    public ViewModel()
        {
            _ShowProgressBar = new RelayCommand(() => ShowProgressBar());
        }

    private void ShowProgressBar()
        {
            IsBusy = true;
            Message = "Loading...";
        }

    public event PropertyChangedEventHandler PropertyChanged;

    private void RaisePropertyChanged(string property)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(property));
            }
        }
}


回答2:

here you go, this example is what you need. http://msdn.microsoft.com/en-us/library/windowsphone/develop/gg442303(v=vs.105).aspx



回答3:

Here is a quick overview about how it works : http://xamlgeek.net/2012/10/30/using-the-progressindicator-in-the-systemtray-in-windows-phone/

You can get it more generic.



回答4:

What you are looking for is an Inderterminate Progress Bar.

You can either call the inbuilt Progress bar from the System Tray[3] or define a custom one of yours in XAML from the toolbox.

For the dotted effect, all you need to do is set the Progress Bar's Indeterminate property to True else it will show a progress bar that shows the percentage completion of process.

Here are some useful articles for your reference:

  1. Create Custom Indeterminate Progress Bar - MSDN
  2. Design Principles for the Progress Bar - MSDN
  3. Progress Bar Tutorial - C# Corner