[英]Get object/item on button click (dynamically created button) - stack panel
[英]Change content stack panel dynamically with button click WPF
我想在同一窗口中單擊按鈕時更改堆棧面板內容/數據。
我在窗口的左側和右側有一個菜單列表,我有 2 個要更新的堆棧面板。 這實際上是我的配置屏幕。 以下是我的 XAML 代碼:
<Window x:Class="Manager.Screens.Configurations"
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:Manager.Screens"
mc:Ignorable="d"
Title="Configurations" Height="850" Width="1000" WindowStyle="None" >
<Border
BorderBrush="Black"
BorderThickness="0"
Padding="0">
<Grid Background="White" ShowGridLines="True" Margin="-3,0,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="200*"/>
<ColumnDefinition Width="263*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" Name="StackPanel1" VerticalAlignment="Top" Height="Auto" Width="Auto">
<Image Source="Resources\Images\config_back.jpg" Stretch="Fill" Opacity="0.65" Height="Auto" Margin="-3,-2,0,0"/>
<Button Margin="0,-1450,0,60" Height="38" Background="Transparent">
<StackPanel Orientation="Horizontal" Width="332">
<Image Source="Resources\Images\tools.png" Margin="75,0,25,0"/>
<TextBlock Text="General" VerticalAlignment="Center" FontSize="18" FontWeight="Bold" Foreground="#FFFF8C3D"/>
</StackPanel>
</Button>
<Button Margin="0,-1350,0,10" Height="38" Background="Transparent">
<StackPanel Orientation="Horizontal" Width="332">
<Image Source="Resources\Images\setting.png" Margin="75,0,25,0"/>
<TextBlock Text="Settings" VerticalAlignment="Center" FontSize="18" FontWeight="Bold" Foreground="#FFFF8C3D"/>
</StackPanel>
</Button>
<Button Margin="0,-1250,0,-40" Height="38" Background="Transparent">
<StackPanel Orientation="Horizontal" Width="332">
<Image Source="Resources\Images\user.png" Margin="75,0,25,0"/>
<TextBlock Text="Limits/Stations" VerticalAlignment="Center" FontSize="18" FontWeight="Bold" Foreground="#FFFF8C3D"/>
</StackPanel>
</Button>
<Button Margin="0,-1150,0,-90" Height="38" Background="Transparent">
<StackPanel Orientation="Horizontal" Width="332">
<Image Source="Resources\Images\user.png" Margin="75,0,25,0"/>
<TextBlock Text="Portions" VerticalAlignment="Center" FontSize="18" FontWeight="Bold" Foreground="#FFFF8C3D"/>
</StackPanel>
</Button>
<Button Margin="0,-1050,0,-140" Height="38" Background="Transparent">
<StackPanel Orientation="Horizontal" Width="332">
<Image Source="Resources\Images\user.png" Margin="75,0,25,0"/>
<TextBlock Text="Label Templates" VerticalAlignment="Center" FontSize="18" FontWeight="Bold" Foreground="#FFFF8C3D"/>
</StackPanel>
</Button>
<Button Margin="0,-950,0,-190" Height="38" Background="Transparent">
<StackPanel Orientation="Horizontal" Width="332">
<Image Source="Resources\Images\user.png" Margin="75,0,25,0"/>
<TextBlock Text="RFID Containers" VerticalAlignment="Center" FontSize="18" FontWeight="Bold" Foreground="#FFFF8C3D"/>
</StackPanel>
</Button>
<Button Margin="0,-850,0,-240" Height="38" Background="Transparent">
<StackPanel Orientation="Horizontal" Width="332">
<Image Source="Resources\Images\user.png" Margin="75,0,25,0"/>
<TextBlock Text="User Management" VerticalAlignment="Center" FontSize="18" FontWeight="Bold" Foreground="#FFFF8C3D"/>
</StackPanel>
</Button>
</StackPanel>
<StackPanel Grid.Column="1" Grid.Row="0" HorizontalAlignment="Stretch" Name="StackPanel2" VerticalAlignment="Top" Orientation="Vertical">
</StackPanel>
<StackPanel Grid.Column="2" Grid.Row="0" HorizontalAlignment="Left" Name="StackPanel3" VerticalAlignment="Top">
<TextBlock FontSize="18" HorizontalAlignment="Center" Margin="0,0,0,15">StackPanel3</TextBlock>
<Button Margin="10">Button 7</Button>
<Button Margin="10">Button 8</Button>
<Button Margin="10">Button 9</Button>
<TextBlock>ColumnDefinition.Width="Auto"</TextBlock>
<TextBlock>StackPanel.HorizontalAlignment="Left"</TextBlock>
<TextBlock>StackPanel.VerticalAlignment="Top"</TextBlock>
<TextBlock>StackPanel.Orientation="Vertical"</TextBlock>
<TextBlock>Button.Margin="10"</TextBlock>
</StackPanel>
</Grid>
</Border>
</Window>
到目前為止,我還沒有編寫任何控件或函數,請幫助我,因為我是新手,如何在 WPF 中完成。
基本上有三種主要方法可以在視圖上顯示/隱藏控件。 下面是為您提供每個示例的代碼:
XAML:
<Window x:Class="WpfApp1.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"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Window.Resources>
<BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Rectangle Grid.Column="0" Grid.Row="0" Visibility="{Binding IsBlueRectangleVisible, Converter={StaticResource BooleanToVisibilityConverter}}" Fill="Blue" />
<Button Grid.Column="1" Grid.Row="0" Content="Binding to ViewModel" Command="{Binding BlueRectangleSwitchCommand}"/>
<Rectangle Grid.Column="0" Grid.Row="1" Visibility="{Binding ElementName=toggleBtn, Path=IsChecked, Converter={StaticResource BooleanToVisibilityConverter}}" Fill="Red" />
<ToggleButton Grid.Column="1" Grid.Row="1" x:Name="toggleBtn" Content="Toggle switch" />
<Rectangle x:Name="greenRectangle" Grid.Column="0" Grid.Row="2" Fill="Green" />
<Button Grid.Column="1" Grid.Row="2" Content="Code behind" Click="GreenRectangleBtnClick"/>
</Grid>
</Window>
后面的代碼:
public partial class MainWindow : Window, INotifyPropertyChanged
{
public MainWindow()
{
InitializeComponent();
// Blue rectangle
// Initialize the command that is binded to one of your buttons
BlueRectangleSwitchCommand = new RelayCommand(o =>
{
// Switches the flag binded to Visibility property of one of your Rectangles
IsBlueRectangleVisible = !IsBlueRectangleVisible;
// Notify that UI shoud be re-rendered
OnPropertyChanged(nameof(IsBlueRectangleVisible));
});
// Next line is needed in order to bind this object to the DataContext of itself (wierd, isn't it?)
// So the MainWindow would know where to llok up for the properties you are binding to in XAML
DataContext = this;
}
// Blue rectangle
// Property that is binded to Visibility property of one of your Rectangles
public bool IsBlueRectangleVisible { get; set; }
// Blue rectangle
// Property that is binded to Command property of one of your Rectangles
public ICommand BlueRectangleSwitchCommand { get; private set; }
// Blue rectangle
// This implementation of INotifyPropertyChanged interface allows you to use OnPropertyChanged
// that is needed for notifying UI that your properties changed
#region INotifyPropertyChanged
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged(string propertyName)
=> PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
#endregion
// Green rectangle
private void GreenRectangleBtnClick(object sender, RoutedEventArgs e)
{
greenRectangle.Visibility = greenRectangle.Visibility == Visibility.Visible
? Visibility.Collapsed
: Visibility.Visible;
}
}
我添加了評論,以便您可以輕松區分每個評論。 因為由您決定哪一種更適合您。
但這是我的建議:
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.