I am trying to make funcionality, to make larger text across whole application for user when he clicks a 'increase font size' button. Using MVVM, I have done it like this:

1. Increase font size button click
2. increase value of double field 'fontSize' which is binded to almost every text in layout
3. Update UI with new value after button click

However I don't know how to achieve this in Collectionview where I have got Binding in .xaml file, with some particular List (item is model class). The collectionview DataTemplate contains labels where I want to increase font size. Is there a way to do this without adding 'fontSize' field in my model class. If not how to update UI with 'new' List with increased font sizes. I appreciate any help, tips and discussions. Thank you.

CodePudding user response：

You can create bindableproperty(fontsize) in your viewmodel and use Relative Binding so the label in Collectionview can change it's fontsize,code like:

ViewMode:

   public class ColViewModel:BindableObject
    {
        public ObservableCollection<Student> students { set; get; }
        public static readonly BindableProperty FontSizeProperty =
        BindableProperty.Create("fontsize", typeof(int), typeof(ColViewModel), null);
        public int fontsize
        {
            get { return (int)GetValue(FontSizeProperty); }
            set { SetValue(FontSizeProperty, value); }
        }
        public  ICommand IncreaseCommand { private set; get; }
        public ColViewModel()
        {students = new ObservableCollection<Student>();
            getStudents();
            fontsize = 24;
            IncreaseCommand = new Command(() => {
                fontsize  ;
            });
        }

View:

<StackLayout>
    <Label Text="This is a Title" FontSize="{Binding fontsize}"/>
    <CollectionView ItemsSource="{Binding students}">
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <Label Text="{Binding Name}" FontSize="{Binding Source={RelativeSource AncestorType={x:Type local:ColViewModel}}, Path=fontsize}"/>
                
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
    <Button Text="Click to increase fontsize" Command="{Binding IncreaseCommand}"/>
</StackLayout>

Edit:

  xmlns:local="clr-namespace:MyForms2.ViewModels"