Теги Xamarin Forms в CarouselView

Я использую новый элемент управления CarouselView в своем приложении для отображения коллекции текста / статьи. Каждая статья в коллекции также содержит строковый массив текста, который я называю тегами. Я хотел бы отображать эти теги горизонтально в карусельном представлении, используя элемент управления, который позволяет привязку данных. Ожидаемый вид должен выглядеть примерно так, чуть ниже основного текста: Ожидаемый вид тегов

Есть идеи о том, как я могу этого добиться?


person Noel    schedule 06.07.2016    source источник
comment
Каждое представление может иметь глобальную переменную Tittle или Tag, и вы можете получить к ней доступ во всем своем коде: public string Tag1 = "Tag 1";   -  person Mario Galván    schedule 06.07.2016


Ответы (1)


Что ж, сначала хорошие / плохие новости: ListView позволит вам представить привязываемый набор тегов, но, к сожалению, в настоящее время он не поддерживает ориентацию Horizontal, поэтому он не соответствует вашим потребностям.

Следующим лучшим вариантом будет горизонтальный StackLayout, содержащийся в ScrollView:

<ScrollView Orientation="Horizontal">
  <StackLayout x:Key="tags" Orientation="Horizontal">
  </StackLayout>
</ScrollView>

И заполните этот StackLayout данными из ViewModel при изменении контекста привязки или этого свойства. В приведенном ниже примере StackLayout заполняется Label представлениями, оформленными с использованием стиля с именем «TagStyleName».

// Note: If this code doesn't work, someone else wrote it. 
protected override OnBindingContextChanged() {
  var vm = this.BindingContext as MyViewModelClass;
  if (vm == null) return;
  vm.PropertyChanged += (o, e) => {
    if (e.PropertyName == "Tags") {
      WatchTagsForChanges();
      RefreshTags();
    }
  };
}

private void WatchTagsForChanges() {
  var vm = this.BindingContext as MyViewModelClass;
  if (vm == null) return;

  vm.Tags.CollectionChanged += (o, e) => RefreshTags();
}

private void RefreshTags() {
  var vm = this.BindingContext as MyViewModelClass;
  if (vm == null) return;

  this.tags.Children.Clear()
  foreach (var tag in vm.Tags) {
    this.tags.Children.Add(new Label{ Text = tag, Style = "TagStyleName" }));
  }
}
person Andy Hopper    schedule 06.07.2016
comment
Спасибо. Ваше решение приходило мне в голову раньше, однако я отложил его как ПЛАН Б, так как я искал решение, которое можно было бы привязывать в рамках carouselview, чтобы избежать задержек при загрузке дочерних элементов при прокрутке карусели. Я наткнулся на эту [ссылку] (github. com / daniel-luberda / DLToolkit.Forms.Controls / blob / master /). У меня не было особого успеха, и из-за нехватки времени на проект я использовал план Б. Следовательно, ваш ответ является ответом. - person Noel; 10.07.2016