基于实际宽度的可见性在网格中表现得很奇怪

我试图理解如何将子元素的可见性绑定到父元素的大小。我的策略是构建一个具有int阈值(它将与父控件的宽度相对应)的转换器，并基于该阈值决定子元素是否可见:

public class IntToVisibilityConverter : IValueConverter
{
    public IntToVisibilityConverter()
    {
        FalseVisibility = Visibility.Collapsed;
        Negate = false;
        VisibilityThreshold = 0;
    }
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        int iVal;
        bool result = int.TryParse(value.ToString(), out iVal);
        if (!result) return value;
        bool isVisible;
        if (iVal < VisibilityThreshold)
        {
            isVisible = false;
        }
        else
        {
            isVisible = true;
        }
        isVisible = Negate ? !isVisible : isVisible;
        if (isVisible)
        {
            return Visibility.Visible;
        }
        else
        {
            return FalseVisibility;
        }
    }
    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        Visibility? val = null;
        if (value is Visibility) val = (Visibility)value;
        if (!val.HasValue) return value;
        bool result = val == Visibility.Visible;
        result = Negate ? !result : result;
        if (result)
        {
            return VisibilityThreshold;
        }
        else
        {
            return VisibilityThreshold - 1;
        }
    }
    public bool Negate { get; set; }
    public int VisibilityThreshold { get; set; }
    public Visibility FalseVisibility { get; set; }
}

为了测试它是如何工作的，我构建了一个非常简单的UI，看起来像这样:

<Window.Resources>
    <ResourceDictionary>
        <local:IntToVisibilityConverter x:Key="IntConverter" VisibilityThreshold="600" Negate="True" />
    </ResourceDictionary>
</Window.Resources>
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="50" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Button Grid.Column="1" x:Name="button1">
        <Ellipse Fill="Orange" Width="100" Height="100" Visibility="{Binding ElementName=button1, Path=ActualWidth, Converter={StaticResource IntConverter}}" />
    </Button>
</Grid>

这工作得很好，没有问题-当我拉伸窗口和按钮达到一定的宽度时，椭圆消失，当我对比窗口回来时重新出现。

然而，当我像这样向网格中添加另一列时，我遇到了奇怪的行为:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="50" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Button Grid.Column="1" x:Name="button1">
        <Ellipse Fill="Orange" Width="100" Height="100" Visibility="{Binding ElementName=button1, Path=ActualWidth, Converter={StaticResource IntConverter}}" />
    </Button>
    <Button Grid.Column="2" x:Name="button2">
        <Ellipse Fill="DarkOrange" Width="100" Height="100" Visibility="{Binding ElementName=button2, Path=ActualWidth, Converter={StaticResource IntConverter}}" />
    </Button>
</Grid>

现在，当我运行这个应用程序时，如果我展开窗口，使按钮的宽度超过阈值，而不是椭圆消失，它们开始闪烁。就像每次改变宽度，它们只是来回改变它们的可见性，而不是永久地折叠。

有谁能解释一下为什么它会这样做，我怎么做才能使它不会出现意外?

谢谢。