复选框的 UWP CustomRenderer:复选框上的指针更改样式?
UWP CustomRenderer for Checkbox: Pointer over Checkbox changes style?
我正在使用 Xamarin.Forms 并在 UWP 中为 Checkbox 创建了一个 CustomRenderer。当我通过单击按钮 "Alle" 将 ListView
中我的项目的所有复选框设置为 true
时,复选框正确显示并在框中选中:
但是,如果我将鼠标悬停在复选框上,它们会立即改变外观(复选框消失但仍处于选中状态)。在下面的屏幕截图中,我将光标移到第 3 个 - 第 7 个复选框上:
这是我在 CustomRenderer 中覆盖的 OnElementChanged
方法:
protected override void OnElementChanged(ElementChangedEventArgs<EvaCheckbox> e)
{
base.OnElementChanged(e);
var model = e.NewElement;
if (model == null)
{
return;
}
nativeCheckbox = new CheckBox();
CheckboxPropertyChanged(model, null);
model.PropertyChanged += OnElementPropertyChanged;
nativeCheckbox.Checked += (object sender, Windows.UI.Xaml.RoutedEventArgs eargs) =>
{
model.IsChecked = (bool)nativeCheckbox.IsChecked;
};
nativeCheckbox.Unchecked += (object sender, Windows.UI.Xaml.RoutedEventArgs eargs) =>
{
model.IsChecked = (bool)nativeCheckbox.IsChecked;
};
SetNativeControl(nativeCheckbox);
}
我试图覆盖 nativeCheckbox
的 PointerEntered
事件。它有效,例如,如果我在此事件中将 model.IsChecked 设置为 true,它将设置为 true:
nativeCheckbox.PointerEntered += (s, args) =>
{
model.IsChecked = true;
};
但我不知道如何(即使在这个地方)防止复选框在将光标移动到复选框上方时更改其外观。像这样将触发事件保留为空代码不会改变所描述的行为:
nativeCheckbox.PointerEntered += (s, args) => { };
当我将光标移到复选框上时,如何防止复选框更改其外观?
更新:
我已经为这个问题创建了一个示例项目。您可以在此处找到存储库:https://github.com/Zure1/CustomCheckbox
它具有与描述的完全相同的行为。在下面的截图中,我按下了屏幕底部的按钮 "All",然后复选框看起来是正确的,里面有一个勾:
将鼠标光标移动到底部的 3 个复选框后,它们的外观发生了变化:
信息:我正在桌面上调试 (Windows 10)。不知道WinPhone有没有这个问题。以防万一你想知道为什么我的复选框是红色的:Windows 中我的系统颜色是红色的。
这是一个棘手的问题,因为我已经为这个问题苦苦挣扎了一段时间,我会尽力回答这个问题。
TL;DR: 这是由 ViewCell 引起的。
问题归结为 Xamarin Forms ListView 和 ViewCell。
我已经好几个月没能找到原因了,解决这个问题的方法是每次发生更改时都刷新 ListView,从而强制重绘整个 ListView,这确实会影响性能.
我对可能原因的有根据的猜测是 ViewCell 的渲染代码缺少某些东西。
关于您的特定问题,我创建了一个 CheckBoxCell,您可以使用它来显示带有标题的复选框列表。 I forked your project and made the changes.
这将显示类似于您要实现的内容并且没有渲染问题,因此将是一个很好的起点。您可以对其进行自定义以显示图像等,但您必须在 platform-specific 布局代码中执行此操作。
请注意,我只为 UWP 创建了代码,这应该足以让您使用其他平台。
希望对您有所帮助。
我正在使用 Xamarin.Forms 并在 UWP 中为 Checkbox 创建了一个 CustomRenderer。当我通过单击按钮 "Alle" 将 ListView
中我的项目的所有复选框设置为 true
时,复选框正确显示并在框中选中:
但是,如果我将鼠标悬停在复选框上,它们会立即改变外观(复选框消失但仍处于选中状态)。在下面的屏幕截图中,我将光标移到第 3 个 - 第 7 个复选框上:
这是我在 CustomRenderer 中覆盖的 OnElementChanged
方法:
protected override void OnElementChanged(ElementChangedEventArgs<EvaCheckbox> e)
{
base.OnElementChanged(e);
var model = e.NewElement;
if (model == null)
{
return;
}
nativeCheckbox = new CheckBox();
CheckboxPropertyChanged(model, null);
model.PropertyChanged += OnElementPropertyChanged;
nativeCheckbox.Checked += (object sender, Windows.UI.Xaml.RoutedEventArgs eargs) =>
{
model.IsChecked = (bool)nativeCheckbox.IsChecked;
};
nativeCheckbox.Unchecked += (object sender, Windows.UI.Xaml.RoutedEventArgs eargs) =>
{
model.IsChecked = (bool)nativeCheckbox.IsChecked;
};
SetNativeControl(nativeCheckbox);
}
我试图覆盖 nativeCheckbox
的 PointerEntered
事件。它有效,例如,如果我在此事件中将 model.IsChecked 设置为 true,它将设置为 true:
nativeCheckbox.PointerEntered += (s, args) =>
{
model.IsChecked = true;
};
但我不知道如何(即使在这个地方)防止复选框在将光标移动到复选框上方时更改其外观。像这样将触发事件保留为空代码不会改变所描述的行为:
nativeCheckbox.PointerEntered += (s, args) => { };
当我将光标移到复选框上时,如何防止复选框更改其外观?
更新:
我已经为这个问题创建了一个示例项目。您可以在此处找到存储库:https://github.com/Zure1/CustomCheckbox
它具有与描述的完全相同的行为。在下面的截图中,我按下了屏幕底部的按钮 "All",然后复选框看起来是正确的,里面有一个勾:
将鼠标光标移动到底部的 3 个复选框后,它们的外观发生了变化:
信息:我正在桌面上调试 (Windows 10)。不知道WinPhone有没有这个问题。以防万一你想知道为什么我的复选框是红色的:Windows 中我的系统颜色是红色的。
这是一个棘手的问题,因为我已经为这个问题苦苦挣扎了一段时间,我会尽力回答这个问题。
TL;DR: 这是由 ViewCell 引起的。
问题归结为 Xamarin Forms ListView 和 ViewCell。
我已经好几个月没能找到原因了,解决这个问题的方法是每次发生更改时都刷新 ListView,从而强制重绘整个 ListView,这确实会影响性能.
我对可能原因的有根据的猜测是 ViewCell 的渲染代码缺少某些东西。
关于您的特定问题,我创建了一个 CheckBoxCell,您可以使用它来显示带有标题的复选框列表。 I forked your project and made the changes.
这将显示类似于您要实现的内容并且没有渲染问题,因此将是一个很好的起点。您可以对其进行自定义以显示图像等,但您必须在 platform-specific 布局代码中执行此操作。
请注意,我只为 UWP 创建了代码,这应该足以让您使用其他平台。
希望对您有所帮助。