通过在Windows Phone 8中应用以下样式,提示不会出现在电话文本框中?

时间:2014-07-19 09:25:16

标签: windows-phone-8 windows-phone-toolkit

<Style x:Key="chatTextBox" TargetType="toolkit:PhoneTextBox">
        <Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilyNormal}" />
        <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="Foreground" Value="{StaticResource PhoneTextBoxForegroundBrush}" />
        <Setter Property="BorderBrush" Value="{StaticResource PhoneTextBoxBrush}" />
        <Setter Property="SelectionBackground" Value="Transparent" />
        <Setter Property="SelectionForeground" Value="Transparent" />
        <Setter Property="Hint" Value="Enter Message" />
        <Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}" />
        <Setter Property="Padding" Value="2" />
        <Setter Property="Template">
        <Setter.Value>
        <ControlTemplate TargetType="toolkit:PhoneTextBox">
        <Grid Background="Transparent">
        <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="CommonStates">
        <VisualState x:Name="Normal" />
        <VisualState x:Name="MouseOver" />
        <VisualState x:Name="Disabled">
        <Storyboard>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="EnabledBorder" Storyboard.TargetProperty="Visibility">
        <DiscreteObjectKeyFrame KeyTime="0">
        <DiscreteObjectKeyFrame.Value>
        <Visibility>Collapsed</Visibility>
        </DiscreteObjectKeyFrame.Value>
        </DiscreteObjectKeyFrame>
        </ObjectAnimationUsingKeyFrames>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledOrReadonlyBorder" Storyboard.TargetProperty="Visibility">
        <DiscreteObjectKeyFrame KeyTime="0">
        <DiscreteObjectKeyFrame.Value>
        <Visibility>Visible</Visibility>
        </DiscreteObjectKeyFrame.Value>
        </DiscreteObjectKeyFrame>
        </ObjectAnimationUsingKeyFrames>
        </Storyboard>
        </VisualState>

        </VisualStateGroup>
        <VisualStateGroup x:Name="FocusStates">
        <VisualState x:Name="Focused" />


        <VisualState x:Name="Unfocused" />
        </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <Border x:Name="EnabledBorder"
        Margin="{StaticResource PhoneTouchTargetOverhang}"
        Background="{TemplateBinding Background}"
        BorderBrush="{TemplateBinding BorderBrush}"
        BorderThickness="{TemplateBinding BorderThickness}">
        <ContentControl x:Name="ContentElement"
        Margin="{StaticResource PhoneTextBoxInnerMargin}"
        HorizontalContentAlignment="Stretch"
        VerticalContentAlignment="Stretch"
        BorderThickness="0"
        Padding="{TemplateBinding Padding}" />
        </Border>
        <Border x:Name="DisabledOrReadonlyBorder"
        Margin="{StaticResource PhoneTouchTargetOverhang}"
        Background="Transparent"
        BorderBrush="{StaticResource PhoneDisabledBrush}"
        BorderThickness="{TemplateBinding BorderThickness}"
        Visibility="Collapsed">
        <TextBox x:Name="DisabledOrReadonlyContent"
        Background="Transparent"
        FontFamily="{TemplateBinding FontFamily}"
        FontSize="{TemplateBinding FontSize}"
        FontStyle="{TemplateBinding FontStyle}"
        FontWeight="{TemplateBinding FontWeight}"
        Foreground="{StaticResource PhoneDisabledBrush}"
        IsReadOnly="True"
        SelectionBackground="{TemplateBinding SelectionBackground}"
        SelectionForeground="{TemplateBinding SelectionForeground}"
        Text="{TemplateBinding Text}"
        TextAlignment="{TemplateBinding TextAlignment}"
        TextWrapping="{TemplateBinding TextWrapping}" />
        </Border>
        </Grid>
        </ControlTemplate>
        </Setter.Value>
        </Setter>
        </Style>  

我使用上面的代码删除了PhoneTextBox中的背景聚焦颜色,这是在toolkit中。一切都很好,但提示没有出现。应用此样式后。 如果有人帮助我高度赞赏。

1 个答案:

答案 0 :(得分:1)

根据您的需要,我刚刚为PhoneTextBox创建了样式并为其应用了这种样式。背景在正常和聚焦状态下都是透明的。

<Style x:Key="PhoneTextBoxStyle1" TargetType="toolkit:PhoneTextBox">
        <Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilyNormal}"/>
        <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Foreground" Value="{StaticResource WhiteBrush}"/>
        <Setter Property="BorderBrush" Value="{StaticResource PhoneTextBoxBrush}"/>
        <Setter Property="SelectionBackground" Value="{StaticResource PhoneAccentBrush}"/>
        <Setter Property="SelectionForeground" Value="{StaticResource PhoneTextBoxSelectionForegroundBrush}"/>
        <Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}"/>
        <Setter Property="Hint" Value="sample"/>
        <Setter Property="HintStyle" Value="{StaticResource HintCustomStyle}"/>
        <Setter Property="Padding" Value="{StaticResource PhoneBorderThickness}"/>

        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="toolkit:PhoneTextBox">
                    <Grid x:Name="RootGrid" Background="Transparent">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="HintBorder">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Collapsed</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="TextBorder">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="TextBorder">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="TextBorder">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="0"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="HorizontalAlignment" Storyboard.TargetName="Text">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <HorizontalAlignment>Stretch</HorizontalAlignment>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="FocusStates">
                                <VisualState x:Name="Focused">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="HintBorder">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="HintBorder">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxEditBorderBrush}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Unfocused"/>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="LengthIndicatorStates">
                                <VisualState x:Name="LengthIndicatorVisible">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="LengthIndicator">
                                            <DiscreteObjectKeyFrame KeyTime="0:0:0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="RootGrid">
                                            <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="0, 0, 0, 27"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="LengthIndicator">
                                            <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="0.6"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimation Duration="0:0:0.350" To="32" Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.Y)" Storyboard.TargetName="LengthIndicator">
                                            <DoubleAnimation.EasingFunction>
                                                <ExponentialEase Exponent="6"/>
                                            </DoubleAnimation.EasingFunction>
                                        </DoubleAnimation>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="LengthIndicatorHidden">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0:0:0.350" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.Y)" Storyboard.TargetName="LengthIndicator">
                                            <DoubleAnimation.EasingFunction>
                                                <ExponentialEase Exponent="6"/>
                                            </DoubleAnimation.EasingFunction>
                                        </DoubleAnimation>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="RootGrid">
                                            <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="0, 0, 0, 0"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="LengthIndicator">
                                            <DiscreteObjectKeyFrame KeyTime="0:0:0.350" Value="0"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="LengthIndicator">
                                            <DiscreteObjectKeyFrame KeyTime="0:0:0.350">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Collapsed</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Border x:Name="LengthIndicatorBorder">
                            <TextBlock x:Name="LengthIndicator" Foreground="{StaticResource PhoneContrastBackgroundBrush}" FontSize="{StaticResource PhoneFontSizeNormal}" HorizontalAlignment="Right" Margin="{StaticResource PhoneMargin}" Opacity="0" TextAlignment="Right" VerticalAlignment="Bottom">
                                <TextBlock.RenderTransform>
                                    <TranslateTransform/>
                                </TextBlock.RenderTransform>
                            </TextBlock>
                        </Border>
                        <Border x:Name="HintBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="{StaticResource PhoneTouchTargetOverhang}">
                            <Grid>
                                <ContentControl x:Name="HintContent" Background="Transparent" Content="{TemplateBinding Hint}" HorizontalAlignment="Left" Margin="3,0,3,0" Style="{TemplateBinding HintStyle}" Visibility="{TemplateBinding ActualHintVisibility}" VerticalAlignment="Center"/>
                                <ContentControl x:Name="ContentElement" BorderThickness="0" HorizontalContentAlignment="Stretch" Margin="{StaticResource PhoneTextBoxInnerMargin}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="Stretch"/>
                            </Grid>
                        </Border>
                        <Border x:Name="TextBorder" BorderBrush="{StaticResource PhoneDisabledBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="Transparent" Margin="{StaticResource PhoneTouchTargetOverhang}" Visibility="Collapsed">
                            <TextBox x:Name="Text" Foreground="{StaticResource PhoneDisabledBrush}" FontWeight="{TemplateBinding FontWeight}" FontStyle="{TemplateBinding FontStyle}" FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}" HorizontalAlignment="Left" SelectionForeground="{TemplateBinding SelectionForeground}" SelectionBackground="{TemplateBinding SelectionBackground}" TextAlignment="{TemplateBinding TextAlignment}" TextWrapping="{TemplateBinding TextWrapping}" Text="{TemplateBinding Text}"/>
                        </Border>
                        <Border x:Name="ActionIconBorder" Background="Transparent" HorizontalAlignment="Right" Height="72" VerticalAlignment="Bottom" Width="84">
                            <Image x:Name="ActionIcon" Height="26" Source="{TemplateBinding ActionIcon}" Width="26"/>
                        </Border>
                        <TextBlock x:Name="MeasurementTextBlock" FontWeight="{TemplateBinding FontWeight}" FontStyle="{TemplateBinding FontStyle}" FontStretch="{TemplateBinding FontStretch}" FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}" IsHitTestVisible="False" Margin="8" Opacity="0" TextAlignment="{TemplateBinding TextAlignment}" TextWrapping="{TemplateBinding TextWrapping}" Text="{TemplateBinding Text}"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

最后添加以下代码作为提示样式。

<Style TargetType="ContentControl" x:Key="HintCustomStyle">
        <Setter Property="FontFamily" Value="Calibri"/>
        <Setter Property="Foreground" Value="Aqua"/>
        <Setter Property="FontSize" Value="30"/>
    </Style>

如果要自定义提示样式,请更改HintCustomStyle。