Как изменить видимость элемента на основе элементов CollectionView - PullRequest
0 голосов
/ 19 апреля 2020

В моем приложении я создал страницу с CollectionView, когда в пустом виде этот CollectionView отображает Label и одним нажатием кнопки новые элементы добавляются в CollectionView. Я хочу, чтобы метка также исчезла или установила для ее видимости значение false при нажатии кнопки.
XAML для CollectionView и метки

<!--Recent Doctors List-->
                    <CollectionView Grid.Row="2"
                                    ItemsSource="{Binding RecentDoctors}">

                            <CollectionView.ItemTemplate>
                                <DataTemplate>
                                    <Grid ColumnSpacing="0"
                                      RowSpacing="0"
                                      Padding="0,10,0,10">

                                        <!--Recent Doctors Item Template-->
                                        <pancake:PancakeView BackgroundColor="#F2F2F2"
                                                         HasShadow="True"
                                                         Elevation="5"
                                                         CornerRadius="10"
                                                         Margin="7,0"
                                                         Padding="20,5,0,5">
                                            <Grid>
                                                <Grid.ColumnDefinitions>
                                                    <ColumnDefinition Width="80"/>
                                                    <ColumnDefinition Width="*"/>
                                                </Grid.ColumnDefinitions>

                                                <!--Doctors Image-->
                                                <Frame Grid.Column="0" 
                                                   BackgroundColor="#CCCCCC"
                                                   IsClippedToBounds="True"
                                                   Padding="0"
                                                   HasShadow="False"
                                                   CornerRadius="100"
                                                   HeightRequest="80">

                                                    <Image HorizontalOptions="Center"
                                                       VerticalOptions="Center"/>
                                                </Frame>

                                                <!--Doctors Info-->
                                                <StackLayout Grid.Column="1"
                                                         VerticalOptions="Center"
                                                         Spacing="0">

                                                    <!--Doctors Name Label-->
                                                    <Label Text="{Binding DoctorsName}"
                                                       TextColor="Black"
                                                       FontAttributes="Bold"
                                                       FontSize="17"/>

                                                    <!--Specialization Label-->
                                                    <Label Text="{Binding Specialization}"
                                                       TextColor="Black"
                                                       FontAttributes="Bold"
                                                       FontSize="17"/>

                                                    <!--Location Label-->
                                                    <Label Text="{Binding Location}"
                                                       TextColor="#999999"
                                                       FontSize="12"/>
                                                </StackLayout>
                                            </Grid>
                                        </pancake:PancakeView>
                                    </Grid>
                                </DataTemplate>
                            </CollectionView.ItemTemplate>
                        </CollectionView>

<!--Add Doctors Button-->
        <pancake:PancakeView Grid.Row="1" 
                             BackgroundColor="#0F8DF4"
                             HasShadow="True"
                             CornerRadius="100"
                             WidthRequest="60"
                             HeightRequest="60"
                             Elevation="6"
                             VerticalOptions="End"
                             HorizontalOptions="End"
                             Margin="0,0,10,20"
                             xamEffects:TouchEffect.Color="White"
                             xamEffects:Commands.Tap="{Binding AddDoctorCommand}">

            <!--Plus Icon-->
            <renderers:FontAwesomeIcon Text="{x:Static helpers:IconsFA.Plus}"
                                       FontSize="30"
                                       HorizontalOptions="Center"
                                       VerticalOptions="Center"
                                       TextColor="White"/>
        </pancake:PancakeView>

        <!--No Doctors Label-->
        <Label Grid.Row="1"
               IsVisible="{Binding HasAnyRecentDoctors, Mode=TwoWay}"
               Text="You Currently Have No Recent Doctors"
               FontSize="14"
               TextColor="Gray"
               HorizontalOptions="Center"
               VerticalOptions="Center"/>

ViewModel

public class TelemedicinePageViewModel : BaseViewModel
    {
        #region PROPERTIES
        /// <summary>
        /// Collection of RecentDoctorsInfo
        /// </summary>
        public ObservableCollection<RecentDoctorsInfo> RecentDoctors { get; set; } = new ObservableCollection<RecentDoctorsInfo>();

        /// <summary>
        /// Collection of MyDoctorsInfo
        /// </summary>
        public ObservableCollection<MyDoctorsInfo> MyDoctors { get; set; } = new ObservableCollection<MyDoctorsInfo>();

        private bool _hasAnyRecentDoctors;
        public bool HasAnyRecentDoctors
        {
            get 
            { 
                if(RecentDoctors.Count == 0)
                {
                    _hasAnyRecentDoctors = true;
                }
                else if(RecentDoctors.Count > 0)
                {
                    _hasAnyRecentDoctors = false;
                }

                return _hasAnyRecentDoctors; 
            }

            set
            {
                _hasAnyRecentDoctors = value;
                OnPropertyChanged();
            }
        }

        /// <summary>
        /// Command for adding new 
        /// </summary>
        public ICommand AddDoctorCommand { get; set; }
        #endregion

        /// <summary>
        /// Main Constructor for the class
        /// </summary>
        public TelemedicinePageViewModel()
        {
            AddDoctorCommand = new RelayCommand(AddDoctor);

            MyDoctors.Add(new MyDoctorsInfo()
            {
                None = "none"
            });
        }

        #region METHODS

        public void AddDoctor()
        {
            RecentDoctors.Add(new RecentDoctorsInfo() 
            { 
                DoctorsName = "Steven Strange",
                Specialization = "Sorcerer Supreme",
                Location = "177a Bleecker St. | USA"
            });
        }
        #endregion
    }

Это то, что я пробовал до сих пор, то есть HasAnyRecentDoctors boolean. Любая помощь приветствуется

1 Ответ

0 голосов
/ 21 апреля 2020

Получается, что CollectionView имеет свойство, известное как EmptyView, которое можно использовать для отображения обратной связи, когда у CollectionView нет элементов / данных. Довольно изящная штука; -).
https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/collectionview/emptyview

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