如何使用占位符将图像放置在WPF中

时间:2019-04-01 17:22:45

标签: wpf xaml

我正在尝试使用WPF创建一个简单的登录窗口,而不是使用按钮,我打算使用小图像作为用户提交凭据的方式。但是,我正在努力使用占位符以实现此目的。代码如下。

<Window x:Class="LogIn.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:LogIn"
        mc:Ignorable="d"

        Title="Log In" Height="330" Width="300" FontSize="14" Background="#04c582"
        Icon="Images/Icon.ico">

    <Border Background="#2e3137" CornerRadius="20" Margin="20">

        <StackPanel Margin="20">

            <Label Content="Login" Foreground="White" FontSize="25" HorizontalAlignment="Center"/>
            <Separator/>

             <!--Username-->
            <Label Content="Username" Foreground="White"/>
            <TextBox Name="UsernameTextbox" Background="#545d5a" Foreground="White" FontSize="18"/>

            <!--Password-->
            <Label Content="Password" Foreground="White"/>
            <PasswordBox Name="PasswordTextbox" Background="#545d5a" Foreground="White" FontSize="18"/>

            <!--Buttons for Window-->
            <Border Padding="5">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>


                    <Grid.Resources>
                        <ControlTemplate x:Key="LogInButton">
                            <Grid Width="AUTO" Height="AUTO">
                                <Image Source="{TemplateBinding Tag}"></Image>
                            </Grid>
                        </ControlTemplate>
                    </Grid.Resources>


                    <Button Template="{StaticResource LogInButton}" Height="50" Width="50" Tag="Images/Plus.png"/>

                </Grid>
            </Border>
        </StackPanel>

    </Border>
</Window>

我遇到问题的代码部分:

<!--Buttons for Window-->
            <Border Padding="5">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>


                    <Grid.Resources>
                        <ControlTemplate x:Key="LogInButton">
                            <Grid Width="AUTO" Height="AUTO">
                                <Image Source="{TemplateBinding Tag}"></Image>
                            </Grid>
                        </ControlTemplate>
                    </Grid.Resources>


                    <Button Template="{StaticResource LogInButton}" Height="50" Width="50" Tag="Images/Plus.png"/>

                </Grid>
            </Border>

在研究该问题时,我看到一个线程告诉我使用TemplateBinding,但是它没有显示图像。有什么建议吗?

编辑:

<Border Padding="5">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>


                <Grid.Resources>
                    <ControlTemplate x:Key="LogInButton">
                        <Grid Width="AUTO" Height="AUTO">
                            <Image Source="{Binding Tag, RelativeSource={RelativeSource TemplatedParent}}"/>
                        </Grid>
                    </ControlTemplate>
                </Grid.Resources>


                <Button Template="{StaticResource LogInButton}" Height="50" Width="50" Tag="Images/Login.png"/>

            </Grid>
        </Border>
    </StackPanel>

</Border>

0 个答案:

没有答案