Есть разные пути решения этого вопроса. Обязательно прочитайте все из них, прежде чем выбрать один - мой любимый (самый простой один) указаны все пути вниз ...
Подход № 1:
Поскольку некоторые люди предполагают, вы можете создать некоторый контроль сбора (я пришел к тому, что в данный момент), определить ObservableCollection в ViewModel, установить страницу Профиль Binding Context к экземпляру этого ViewModel, а также добавлять элементы в коллекции по нажатию кнопки:
public class MyViewModel()
{
public ObservableCollection<int> Items { get; set; } = new ObservableCollection<int>();
}
private MyViewModel _viewModel = new MyViewModel();
public MainPage()
{
InitializeComponent();
BindingContext = _viewModel;
}
correctButton.Clicked += (sender, e) =>
{
App.DB.IncrementScore();
_viewModel.Items.Add(0);
};
Тип ObservableCollection ac tually не имеет значения, так как мы используем один и тот же статический ItemTemplate для всех элементов:
<ContentPage.Resources>
<DataTemplate x:Key="ScoreItemTemplate">
<ViewCell>
<ViewCell.View>
<Label Text="{x:Static local:FontAwesome.FACheck}" FontFamily="FontAwesome" TextColor="Green"/>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ContentPage.Resources>
Основная проблема такого подхода заключается в том, что Xamarin.Forms ListView не может отобразить его элементы по горизонтали. Это означает, что вы должны были бы скачать один из доступных пакетов HorizontalListView NuGet там, или использовать built-in (only in Xamarin.Forms 2.3 and above!) CarouselView:
<CarouselView ItemTemplate="{StaticResource ScoreItemTemplate}" ItemsSource="{Binding Items}"/>
Тогда вы могли бы пожелать, чтобы провести некоторое время, удаляя все визуальные эффекты для пролистывания карусели и для выбора элементов, если вы решили использовать горизонтальный ListView ...
Вместо этого, есть два альтернативных решения, которые включают меньше усилий:
Подход № 2:
Очевидно, что простой подход должен был бы создать «шаблон» ярлык в коде:
private Label CreateScoreLabel()
{
return new Label {Text = FontAwesome.FACheck, TextColor = Color.Green, FontFamily = "FontAwesome"};
}
... добавить горизонтальную StackLayout к странице:
<StackLayout Orientation="Horizontal" x:Name="LabelStack"/>
... и добавить новые ярлыки нелегкий путь:
correctButton.Clicked += (sender, e) =>
{
App.DB.IncrementScore();
LabelStack.Children.Add(CreateScoreLabel());
};
Однако, все это кажется довольно Hacky только за создание списка зеленых галочек. Это приводит нас к ...
... Подход # 3:
Технически, это не совсем то, что вы просили (приращения числа меток), но в соответствии с экрана выстрел мог бы удовлетворить ваши потребности намного проще.
Удалить текст существующего лейбла (так как он не будет показывать ничего при запуске), и вместо того, чтобы дать ему уникальное имя:
<Label x:Name="ScoreLabel" FontFamily="FontAwesome" TextColor="Green"/>
Теперь определим простой метод расширения для string типа, который повторяет заданную строку на определенное количество раз:
public static class StringExtensions
{
public static string Repeat(this string input, int num)
{
return String.Concat(Enumerable.Repeat(input, num));
}
}
(Есть несколько способов сделать это повторить функцию производительными, насколько это возможно, я просто выбрал самый простой однострочник доступного, поиск Sta ckOverflow для детального обсуждения ...)
Теперь вы можете работать с одним Label контроля, определенным в XAML, а просто назначить несколько флажков ему по нажатию кнопки:
correctButton.Clicked += (sender, e) =>
{
App.DB.IncrementScore();
ScoreLabel.Text = FontAwesome.FACheck.Repeat(App.DB.Score); // replace parameter by whatever method allows you to access the current score number
};
Конечно, этот подход может также можно адаптироваться к способу MMVM, просто используя общедоступное свойство bindable string вместо установки атрибута метки Text непосредственно, но для этого я бы посоветовал вам взглянуть на учебник MVVM для начинающих.
Я настоятельно рекомендую посмотреть в архитектуру MVVM для этого приложения. Вы можете привязать свои метки к 'ObservableCollection' в вашем ViewMidel. –
@RobLyndon благодарит.Я знаю о MVVM, но я не знаю, как его применять здесь. Можете ли вы дать мне образец кода, относящийся к моей проблеме? –