如何从CollectionView更改Entry GotFocus上的标签颜色

时间:2020-11-11 16:48:32

标签: c# xaml xamarin xamarin.forms

是否有一种方法可以绑定Xamarin中Label的FontColor状态,以便在Entry(文本框)获得焦点时突出显示Label?

<CollectionView x:Name="documentsListView" ItemsSource="{Binding DocumentsList}">
                    <CollectionView.ItemsLayout>
                        <LinearItemsLayout Orientation="Vertical"
                           ItemSpacing="0" />
                    </CollectionView.ItemsLayout>
                    <CollectionView.ItemTemplate>
                    <DataTemplate>
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="3*" />
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <Label Grid.Column="0"
                               Margin="0,10,0,0"
                               Text="{Binding Name}"  FontSize="Body"/>
                            <Entry Grid.Column="1" Grid.RowSpan="1"
                               IsPassword="False"
                               Keyboard="Numeric"
                               Placeholder="{Binding Count}"
                               Text="{Binding Count, Mode=OneWayToSource}"
                               Unfocused="{Binding OnTextboxLostFocus}"
                               Focused="{Binding OnTextboxGotFocus}"/>
                        </Grid>
                    </DataTemplate>
                </CollectionView.ItemTemplate>
            </CollectionView>

我需要突出显示当用户向Entry(textbox)输入数据时将要更改的元素,并且因为CollectionView中元素之间的空间应较小,以便每次滚动显示尽可能多的数据这可能会使用户混淆他正在更改的元素。我曾考虑过将标签作为参数传递给“事件”,但找不到如何绑定标签的方法。

1 个答案:

答案 0 :(得分:1)

将标签的textColor绑定到模型中的属性,并在textColor时更新entry focused/unfocused

这是我使用的示例:

public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();

        this.BindingContext = new DncMvvmPageModel();
    }
}

public class DncMvvmPageModel
{
    public ObservableCollection<Document> DocumentsList { get; set; }
    public Command OnTextboxLostFocus { get; }
    public Command OnTextboxGotFocus { get; }

    public DncMvvmPageModel()
    {
        OnTextboxLostFocus = new Command(OnTextboxLostFocusMethod);
        OnTextboxGotFocus = new Command(OnTextboxGotFocusMethod);

        DocumentsList = new ObservableCollection<Document>();

        DocumentsList.Add(new Document() {TextColor = Color.Gray });
        DocumentsList.Add(new Document() { TextColor = Color.Gray });
        DocumentsList.Add(new Document() { TextColor = Color.Gray });
        DocumentsList.Add(new Document() { TextColor = Color.Gray });
    }

    public void OnTextboxLostFocusMethod(object sender) {
        FocusEventArgs args = sender as FocusEventArgs;
        Entry entry = args.VisualElement as Entry;
        Document docu = entry.BindingContext as Document;

        docu.TextColor = Color.Red;
    }

    public void OnTextboxGotFocusMethod(object sender)
    {
        FocusEventArgs args = sender as FocusEventArgs;
        Entry entry = args.VisualElement as Entry;
        Document docu = entry.BindingContext as Document;

        docu.TextColor = Color.Blue;
    }
}

public class Document : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    Color textColor;

    public Color TextColor
    {
        set
        {
            if (textColor != value)
            {
                textColor = value;
                if (PropertyChanged != null)
                {
                    PropertyChanged(this, new PropertyChangedEventArgs("TextColor"));
                }
            }
        }
        get
        {
            return textColor;
        }
    }
}

在Xaml中:

<CollectionView x:Name="documentsListView" ItemsSource="{Binding DocumentsList}">
    <CollectionView.ItemsLayout>
        <LinearItemsLayout Orientation="Vertical"
                       ItemSpacing="0" />
    </CollectionView.ItemsLayout>
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="3*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <Label Grid.Column="0"
                           Margin="0,10,0,0"
                           Text="Name"  FontSize="Body" TextColor="{Binding TextColor}"/>
                <Entry Grid.Column="1" Grid.RowSpan="1"
                           IsPassword="False"
                           Keyboard="Numeric"
                           Placeholder="placeholder"
                           Text="Count">

                    <Entry.Behaviors>
                        <behaviors:EventToCommandBehavior EventName="Focused"
                                      Command="{Binding BindingContext.OnTextboxGotFocus, Source={x:Reference MyPage}}" />
                        <behaviors:EventToCommandBehavior EventName="Unfocused"
                                      Command="{Binding BindingContext.OnTextboxLostFocus, Source={x:Reference MyPage}}" />
                    </Entry.Behaviors>

                </Entry>
                  
            </Grid>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>

结果:

enter image description here

如果有任何问题,请随时问我。)