Привязать ProgressRing к mvvm - PullRequest
       3

Привязать ProgressRing к mvvm

0 голосов
/ 25 октября 2019

Я загружаю данные из API и отображаю их в представлении. Пока я жду, я хочу отобразить ProgressRing, но когда я его связываю, он не работает

  1. Привязать кольцо к свойству cityData в двухстороннем режиме и обновить его при изменении свойства
  2. Создано новое свойство в виртуальной машине, которое по умолчанию имеет значение true, и при получении данных оно станет ложным

XAML

<TextBox x:Name="currentLocation"
                 PlaceholderText="Please wait..."
                 IsReadOnly="True"
                 Margin="20"
                 Width="300"
                 Text="{Binding cityData,  Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
<ListView RelativePanel.Below="currentLocation"
                  x:Name="ForecastList"
                  Margin="20"
                  SelectedItem="{Binding currentDay, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                  ItemsSource="{Binding dailyForecasts}">
     <ListView.ItemTemplate>
        <DataTemplate>
            <StackPanel Margin="10">
               <TextBlock x:Name="dateTB" Text="{Binding Date.DayOfWeek}" />
               <TextBlock x:Name="highTB" Text="{Binding Temperature.Maximum.Value, Converter={StaticResource cv}}" FontSize="10" />
               <TextBlock x:Name="lowTB" FontSize="10" Text="{Binding Temperature.Minimum.Value, Converter={StaticResource cv}}" />
            </StackPanel>
        </DataTemplate>
     </ListView.ItemTemplate>
</ListView>
<ProgressRing x:Name="pRing" RelativePanel.Above="ForecastList" RelativePanel.AlignHorizontalCenterWith="currentLocation" IsActive="{Binding ring, Mode=TwoWay}" RelativePanel.Below="currentLocation" />

VM

public class WeatherVM: INotifyPropertyChanged 
{
 public AccuWeather accuWeather { get; set; }    
 private string _cityData;
 public string cityData 
 {
  get { return _cityData; }
  set 
  { 
    if (value != _cityData) 
      {
       _cityData = value;
       onPropertyChanged("cityData");
       GetWeatherData();
      }
   }
 }

 private DailyForecast _currentDay;
 public DailyForecast currentDay 
 {
  get { return _currentDay; }
  set 
  {
   if (value != _currentDay) \
   {
    _currentDay = value;
    onPropertyChanged("currentDay");
   }
  }
 }
 public bool ring { get; set; } = true;
 public ObservableCollection<DailyForecast> dailyForecasts { get; set; }
 public WeatherVM() 
 {
  GetCuurentLocation();
  dailyForecasts = new ObservableCollection<DailyForecast>();
 }
 private async void GetCuurentLocation() {
   cityData = await BingLocator.GetCityData();
 }
public async void GetWeatherData() {
 var geoposition = await LocationManager.GetGeopositionAsync();
 var currentLocationKey = await WeatherAPI.GetCityDstaAsync(geoposition.Coordinate.Point.Position.Latitude, geoposition.Coordinate.Point.Position.Longitude);
 var weatherData = await WeatherAPI.GetWeatherAsync(currentLocationKey.Key);
    if (weatherData != null) {
      foreach (var item in weatherData.DailyForecasts) {
          dailyForecasts.Add(item);
      }
    }
 currentDay = dailyForecasts[0];
 ring = false;
 }
 public event PropertyChangedEventHandler PropertyChanged;
 private void onPropertyChanged(string property) {
   PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(property));
 }
} 
}

Индикатор выполнения появляется при запуске приложения и исчезает при возврате данных

Ответы [ 2 ]

0 голосов
/ 28 октября 2019

Вы можете использовать элемент управления Windows Community Toolkit для отображения индикатора прогресса (индикатор занятости).

<Page ...
     xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"/>

<controls:Loading x:Name="LoadingControl" IsLoading="{Binding IsBusy}">
    <!-- Loading screen content -->
</controls:Loading>
0 голосов
/ 28 октября 2019

Из вашего кода, похоже, проблема с макетом. Сначала вы помещаете ListView ниже currentLocation, затем устанавливаете ProgressRing выше ListView и ниже currentLocation, чтобы высота ProgressRing была равна нулю. Я не совсем понимаю ваш макет, вы можете попытаться установить только RelativePanel.Above="ForecastList" для ProgressRing, чтобы увидеть, появится ли он.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...