C# 不在焦点时隐藏元素

我有一个按钮，点击时会添加一个文本框，用户可以通过点击文本框来编辑文本框的内容

我只需要在文本框处于焦点时显示带有删除功能的图像。i、 e.已被窃听

当文本框失去焦点时，图像应该消失。i、 e.用户已点击另一个控件。有人知道如何做到这一点吗

以下是我到目前为止的情况

    private void Textwriting_Tapped(object sender, TappedRoutedEventArgs e)
    {
        //Set HitTest Visibility
        DragBoundsOverlay.IsHitTestVisible = false;
        emojiCanvas.IsHitTestVisible = false;
        textCanvas.IsHitTestVisible = true;
        inkCanvas.IsHitTestVisible = false;

        //TODO Add Custom Onscreen Keyboard Support

        //Win Onscreen Keyboard Scope - i.e. Number, Text etc
        InputScope scope = new InputScope();
        InputScopeName scopeName = new InputScopeName();
        scopeName.NameValue = InputScopeNameValue.ChatWithoutEmoji;
        scope.Names.Add(scopeName);

        if (AddTextBox == null)
        {
            AddTextBox = new TextBox
            {
                Foreground = new SolidColorBrush(Colors.White),
                Background = new SolidColorBrush(Colors.Transparent),
                BorderBrush = new SolidColorBrush(Colors.Transparent),
                CanDrag = true,
                IsTapEnabled = true,
                PlaceholderText = "Type Text Here...",
                FontSize = 45f,
                AcceptsReturn = true,

                // Win Onscreen Keyboard Settings
                AllowFocusOnInteraction = true,
                PreventKeyboardDisplayOnProgrammaticFocus = false,
                InputScope = scope,

                ManipulationMode = ManipulationModes.All,
                VerticalAlignment = VerticalAlignment.Center,
                HorizontalAlignment = HorizontalAlignment.Center
            };

            //Drag Handlers
            AddTextBox.AddHandler(PointerPressedEvent, new PointerEventHandler(TextManipulation.AddTextBox_PointerPressed), true);
            AddTextBox.AddHandler(PointerReleasedEvent, new PointerEventHandler(TextManipulation.AddTextBox_PointerReleased), true);
            AddTextBox.AddHandler(PointerMovedEvent, new PointerEventHandler(TextManipulation.AddTextBox_PointerMoved), true);

            textCanvas.Children.Add(AddTextBox);
            Canvas.SetLeft(AddTextBox, 30);
            Canvas.SetTop(AddTextBox, 380);

            TextBoxDelete = new Image
            {
                Source = new BitmapImage(new Uri("ms-appx:///Resources/Elements/close.png")),
                Width = 50,
                Height = 50
            };

            TransformGroup TextBoxDelete_Transform = new TransformGroup();
            TextBoxDelete_Transform.Children.Add(TextManipulation._transform);

            TextBoxDelete.RenderTransform = TextBoxDelete_Transform;

            textCanvas.Children.Add(TextBoxDelete);
            Canvas.SetLeft(TextBoxDelete, 0);
            Canvas.SetTop(TextBoxDelete, 350);


        }

    }

XAML

---

您好，虽然我无法获得您确切的UI/UX，但以下是我能够想到的，简单的实现，但基本上，我有相同的想法，不确定是否有正确的方法来实现这一点，使用工具箱或内置控件，总之，在这里

目标是动态添加文本框，并在文本框旁边添加删除按钮，然后当点击文本框时，删除按钮将可见，如果它已失去焦点，例如其他控件收到焦点，则删除按钮将不可见

为此，我创建了一个简单而混乱的UI助手，我使用了一些代码来设置控件的属性

UIHelper.cs

using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;

namespace App1
{
    public static class UIHelper
    {
        public static void CreateRemovableTextBoxToCanvas(Canvas canvas, string label = null)
        {
            canvas.IsHitTestVisible = true;

            InputScope scope = new InputScope();

            InputScopeName scopeName = new InputScopeName
            {
                NameValue = InputScopeNameValue.ChatWithoutEmoji
            };

            scope.Names.Add(scopeName);

            int controlIndex = canvas.Children.Count - 1;

            if (label == null)
            {
                label = "Field " + canvas.Children.Count;
            }

            TextBlock newTextBlock = new TextBlock
            {
                Text = label,
                VerticalAlignment = VerticalAlignment.Center,
                TextAlignment = TextAlignment.Center,
                HorizontalAlignment = HorizontalAlignment.Stretch,
                Margin = new Thickness(0, 0, 10, 0)
            };

            TextBox newTextBox = new TextBox
            {
                Name = "TextBox" + controlIndex,
                Foreground = new SolidColorBrush(Colors.Black),
                Background = new SolidColorBrush(Colors.Transparent),
                BorderBrush = new SolidColorBrush(Colors.DarkGray),
                CanDrag = true,
                IsTapEnabled = true,
                PlaceholderText = "Type Text Here...",
                FontSize = 14f,
                AcceptsReturn = true,

                // Win Onscreen Keyboard Settings
                AllowFocusOnInteraction = true,
                PreventKeyboardDisplayOnProgrammaticFocus = false,
                InputScope = scope,

                ManipulationMode = ManipulationModes.All,
                VerticalAlignment = VerticalAlignment.Center,
                HorizontalAlignment = HorizontalAlignment.Center,
                Width = 130
            };

            Button deleteTextBoxButton = new Button
            {
                Name = "DeleteTextBoxButton" + controlIndex,
                Content = new StackPanel
                {
                    Children =
                    {
                        new SymbolIcon
                        {
                            Symbol = Symbol.Delete
                        },
                    }
                },
                Visibility = Visibility.Collapsed
            };

            StackPanel newTextStackPanel = new StackPanel
            {
                Orientation = Orientation.Horizontal,
                Children = { newTextBlock, newTextBox, deleteTextBoxButton }
            };

            newTextBox.LostFocus += (s, args) => deleteTextBoxButton.Visibility = Visibility.Collapsed;
            newTextBox.GotFocus += (s, args) => deleteTextBoxButton.Visibility = Visibility.Visible;

            int topOffset = 40 * canvas.Children.Count;

            if (canvas.Children.Count > 0)
            {
                Canvas.SetLeft(newTextStackPanel, 0);
                Canvas.SetTop(newTextStackPanel, topOffset);
            }

            canvas.Children.Add(newTextStackPanel);
        }
    }
}

这是我的xaml：

<Page
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    d:DesignHeight="450" d:DesignWidth="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Button Grid.Row="0"
            x:Name="TextMenu"
            Tapped="Textwriting_Tapped"
            Content="Add TextBox" />
        <Canvas Grid.Row="1"
            x:Name="TextCanvas"
            Width="800"
            Height="350"
            AllowDrop="True"
            IsHitTestVisible="False"
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Margin="0,15,0,0" />
    </Grid>

</Page>

---

希望这有帮助

您也可以发布您的xaml吗？AddTextBox和TextBoxDelete都是通过编程方式添加的，没有在xaml中定义。但我会为父画布添加XAML，以防万一。太棒了，这就像一个魅力-谢谢。我只需要：AddTextBox.LostFocus+=s，args=>TextBoxDelete.Visibility=Visibility.Collapsed；美好的如果将其设置为模板控件，则会更好：

<Page
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    d:DesignHeight="450" d:DesignWidth="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Button Grid.Row="0"
            x:Name="TextMenu"
            Tapped="Textwriting_Tapped"
            Content="Add TextBox" />
        <Canvas Grid.Row="1"
            x:Name="TextCanvas"
            Width="800"
            Height="350"
            AllowDrop="True"
            IsHitTestVisible="False"
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Margin="0,15,0,0" />
    </Grid>

</Page>

using Windows.UI.Xaml.Input;

namespace App1
{
    public sealed partial class MainPage
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

        public void Textwriting_Tapped(object sender, TappedRoutedEventArgs e)
        {
           UIHelper.CreateRemovableTextBoxToCanvas(TextCanvas);
        }
    }
}