1

这是一个设置：我有一个带有数字值的文本框。根据要求，每次任何人更改该值时都需要提供随附的评论。因此，在视觉上必须有另一个文本框用于注释，应该显示在第一个文本框旁边。理想情况下，注释文本框需要放置在源自值文本框的标注中，并显示在它的右侧，覆盖它下面的任何内容，就像这张图片一样：在此处输入图像描述

我知道如何在 CSS 和 HTML 中轻松做到这一点。我现在必须在 Silverlight 中做同样的事情。不幸的是，我在这方面不是很强大，所以我特别要问的是如何让 2 个文本框使其中一个出现在另一个旁边（在右侧覆盖它下面的任何控件），并尽可能少地使用 XAML 和代码。

4

2 回答 2

0

好的，我最终写下了我自己的行为

namespace MyNamespace
{
    public class CommentBehavior : Behavior<TextBox>
    {
        private readonly TimeSpan howLongWeWaitBeforePopupCloses = TimeSpan.FromMilliseconds(200);

        private DispatcherTimer popupClosingTimer;
        public static DependencyProperty PopupProperty = DependencyProperty.Register("Popup", typeof(Popup), typeof(CommentBehavior), new PropertyMetadata(null));

        public Popup Popup
        {
            get { return (Popup)this.GetValue(PopupProperty); }
            set { this.SetValue(PopupProperty, value); }
        }

        protected override void OnAttached()
        {
            this.popupClosingTimer = new DispatcherTimer();
            this.popupClosingTimer.Stop();
            this.popupClosingTimer.Interval = howLongWeWaitBeforePopupCloses;
            this.popupClosingTimer.Tick += this.ClosePopup;
            this.AssociatedObject.GotFocus += this.GotFocus;
            this.AssociatedObject.LostFocus += this.LostFocus;
            this.Popup.Child.GotFocus += PopupChild_GotFocus;
            this.Popup.Child.LostFocus += PopupChild_LostFocus;
        }

        private void PopupChild_LostFocus(object sender, RoutedEventArgs e)
        {
            this.popupClosingTimer.Start();
        }

        private void PopupChild_GotFocus(object sender, RoutedEventArgs e)
        {
            this.popupClosingTimer.Stop();
        }

        protected override void OnDetaching()
        {
            this.AssociatedObject.GotFocus -= this.GotFocus;
            this.AssociatedObject.LostFocus -= this.LostFocus;
            this.Popup.GotFocus -= PopupChild_GotFocus;
            this.popupClosingTimer.Tick -= this.ClosePopup;
            this.popupClosingTimer = null;
        }

        private void ClosePopup(object sender, EventArgs e)
        {
            this.Popup.IsOpen = false;
            this.popupClosingTimer.Stop();
        }

        protected void GotFocus(object sender, RoutedEventArgs e)
        {
            this.popupClosingTimer.Stop();
            this.Popup.IsOpen = true;
            var at = this.CalculatePopupPosition();
            this.Popup.HorizontalOffset = at.X;
            this.Popup.VerticalOffset = at.Y;
        }

        private Point CalculatePopupPosition()
        {
            var owner = this.AssociatedObject;
            var transformation = owner.TransformToVisual(Application.Current.RootVisual);
            var at = transformation.Transform(new Point(owner.ActualWidth, 0));
            return at;
        }

        protected void LostFocus(object sender, RoutedEventArgs e)
        {
            this.popupClosingTimer.Start();
        }
    }
}

以及以下 XAML

<Grid x:Name="LayoutRoot" Background="White">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    <StackPanel Grid.Row="0" Background="Red">
        <TextBox Width="200" Text="0.01">
            <i:Interaction.Behaviors>
                <local:CommentBehavior>
                    <local:CommentBehavior.Popup>
                        <Popup>
                            <TextBox Text="Comment" />
                        </Popup>
                    </local:CommentBehavior.Popup>
                </local:CommentBehavior>
            </i:Interaction.Behaviors>
        </TextBox>
    </StackPanel>

</Grid>

于 2012-11-27T14:46:34.123 回答
0

使用 aToolTip并设置 Placement 使其显示在右侧。在 XAML 中，您可以将模板化为ToolTip您想要的外观，即使这意味着模仿TextBox外观。

这是 的目的ToolTip，我强烈认为您应该始终使用正确的工具来完成正确的工作。:)

我希望这有帮助。如果您需要代码示例，请告诉我们。

编辑：添加了以下代码示例：

    <TextBox ToolTipService.Placement="Right">
        <ToolTipService.ToolTip>
            <TextBox Text="{Binding CalloutText, Mode=OneWay}" IsReadOnly="True"/>
        </ToolTipService.ToolTip>
    </TextBox>
于 2012-11-26T20:56:41.797 回答