在Metro風格應用程序中使用XAML的WatermarkTextBox控件

我正在學習XAML Metro風格應用程序中的舞臺。我想用WatermarkTextBox控件創建簡單的登錄頁面，如下圖所示。我的問題是，我想設置WatermarkTextBox的水印文本（Email Id作爲密碼文本）垂直中間。在Metro風格應用程序中使用XAML的WatermarkTextBox控件

enter image description here

我的代碼XMAL線如下

<Page 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:Login" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:Controls="using:WinRTXamlToolkit.Controls" 
    x:Class="Login.MainPage" 
    mc:Ignorable="d"> 

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="163*"/> 
      <RowDefinition Height="101*"/> 
      <RowDefinition Height="112*"/> 
      <RowDefinition Height="114*"/> 
      <RowDefinition Height="116*"/> 
      <RowDefinition Height="162*"/> 
     </Grid.RowDefinitions> 
     <Controls:WatermarkTextBox WatermarkText="Email Id" HorizontalAlignment="Left" Margin="502,10,0,0" Grid.Row="1" VerticalAlignment="Center" Height="60" Width="433" FontFamily="Andalus" FontSize="18" Padding="10, 15, 0, 0"/> 
     <TextBox x:Name="PasswordWatermark" Text="Password" IsHitTestVisible="False" Grid.Row="2" FontSize="18" FontFamily="Andalus" Width="433" Height="60" Margin="502,0,425,52" Padding="10, 15, 0, 0"/> 
     <PasswordBox x:Name="pbPassword" LostFocus="PasswordLostFocus" GotFocus="PasswordGotFocus" Grid.Row="2" FontFamily="Andalus" FontSize="18" Margin="502,0,425,52" Opacity="0" Width="433" Height="60" Padding="10, 15, 0, 0"/> 
     <Button x:Name="btnLogin" Content="Login" HorizontalAlignment="Left" Margin="791,0,0,0" Grid.Row="3" VerticalAlignment="Top" Height="58" Width="147" FontFamily="Andalus" FontSize="18" Background="#FF385936" BorderBrush="#FF644F4F"/> 
    </Grid> 
</Page>

.CS

private void PasswordLostFocus(object sender, RoutedEventArgs e) 
{ 
    CheckPasswordWatermark(); 
} 

private void CheckPasswordWatermark() 
{ 
    var passwordEmpty = string.IsNullOrEmpty(pbPassword.Password); 
    PasswordWatermark.Opacity = passwordEmpty ? 100 : 0; 
    pbPassword.Opacity = passwordEmpty ? 0 : 100; 
} 

private void PasswordGotFocus(object sender, RoutedEventArgs e) 
{ 
    PasswordWatermark.Opacity = 0; 
    pbPassword.Opacity = 100; 
}

您的幫助是篦升值。在此先感謝。

來源

2013-05-21 Pravesh Singh

好的，我沒有使用Vs 2012，所以我無法測試它。我正在編寫記事本。但它可能有所幫助：

<Controls:WatermarkTextBox WatermarkText="Email Id" HorizontalAlignment="Left" Margin="502,10,0,0" Grid.Row="1" 
    VerticalAlignment="Center" Height="60" Width="433" FontFamily="Andalus" FontSize="18" Padding="10, 15, 0, 0"> 
    <Controls:WatermarkTextBox.WatermarkTextStyle> 
     <Style TargetType="TextBlock"> 
      <Setter Property="VerticalAlignment" Value="Center" /> 
     </Style>    
    </Controls:WatermarkTextBox.WatermarkTextStyle>   
<Controls:WatermarkTextBox/>

如果可能，請告訴我結果。

來源

2013-05-21 14:51:36

先生，我檢查了它，但沒有工作！請給任何其他解決方案。 –

可能是因爲Padding？ Cretae一個新的空項目並添加一個WatermarkTextBox控件。並在該項目上測試我的解決方案。看看它是否是你需要的。然後告訴我結果。謝謝。 –

先生，當我將文本輸入到文本框中時，輸入的文本被放入中心，但水印文本（例如電子郵件ID）未放入垂直中心。請幫幫我。感謝您的回覆。 –

我可能是錯的，但文本框包含VerticalContentAlignment和HorizontalContentAlignment屬性。

那些告訴控件如何對齊它們內部的文本。

來源

2013-07-18 13:47:45

在Metro風格應用程序中使用XAML的WatermarkTextBox控件

回答

相關問題