When adding multiple comboxbox controls, after doubl clicking the item to modify the code, VS 2013 uses a generic naming scheme which makes it hard to keep the code straight. For example, ComboBox_SelectionChanged and ComboBox_SelectionChanged_1.
How do I rename a WPF control to make the CS easier to keep track of?
(Hopefully this makes sense and that I'm using the correct terminology. Let me know if this needs clarification.)
CS Code:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace hero_workshop
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void ComboBox_SelectionChanged_1(object sender, SelectionChangedEventArgs e)
{
}
private void ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
}
}
}
WPF Code:
<Window x:Class="hero_workshop.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Hero Workshop" Height="768" Width="1366">
<Grid>
<Menu IsMainMenu="True" Margin="0,0,0,704" Background="White">
<MenuItem Header="_File" />
<MenuItem Header="_Edit" />
<MenuItem Header="_View" />
<MenuItem Header="_Window" />
<MenuItem Header="_Help" />
</Menu>
<TabControl HorizontalAlignment="Left" Height="714" Margin="0,23,0,0" VerticalAlignment="Top" Width="868">
<TabItem Header="Chracter">
<TabItem.Background>
<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#FFF0F0F0" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</TabItem.Background>
<Grid Background="White">
<TextBlock HorizontalAlignment="Left" Margin="10,10,0,0" TextWrapping="Wrap" Text="Character Name" VerticalAlignment="Top"/>
<TextBox HorizontalAlignment="Left" Height="23" Margin="107,7,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="120" TextChanged="TextBox_TextChanged"/>
<TextBlock HorizontalAlignment="Left" Margin="10,36,0,0" TextWrapping="Wrap" Text="Race" VerticalAlignment="Top" RenderTransformOrigin="-0.621,-2.567"/>
<ComboBox x:Name="race_dropdown" HorizontalAlignment="Left" Margin="107,36,0,0" VerticalAlignment="Top" Width="120" SelectionChanged="ComboBox_SelectionChanged_1"/>
<TextBlock HorizontalAlignment="Left" Margin="317,13,0,0" TextWrapping="Wrap" Text="Alignment" VerticalAlignment="Top"/>
<ComboBox HorizontalAlignment="Left" Margin="388,13,0,0" VerticalAlignment="Top" Width="155" SelectionChanged="ComboBox_SelectionChanged"/>
</Grid>
</TabItem>
<TabItem Header="Skills & Feats">
<TabItem.Background>
<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#FFF0F0F0" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</TabItem.Background>
<Grid Background="White"/>
</TabItem>
<TabItem Header="Weapons & Armor">
<TabItem.Background>
<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#FFF0F0F0" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</TabItem.Background>
<Grid Background="White"/>
</TabItem>
<TabItem Header="Equipment">
<TabItem.Background>
<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#FFF0F0F0" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</TabItem.Background>
<Grid Background="White"/>
</TabItem>
<TabItem Header="Background">
<TabItem.Background>
<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#FFF0F0F0" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</TabItem.Background>
<Grid Background="White"/>
</TabItem>
</TabControl>
<ScrollViewer HorizontalAlignment="Left" Height="689" Margin="873,38,0,0" VerticalAlignment="Top" Width="475"/>
</Grid>
</Window>
Scenario 1: Event handler does not exist
You can influence the naming of your code behind event handler by giving your control a name with the x:name extension property. If you have set the name and double click your control you will get a named event handler like NameOfControl_SelectionChanged.
Scenario 2: Event handler does exist
If you already have created the event handler in your code behind file you have to rename both, the event handler in your code behind and the associated xaml property (SelectionChanged="...") manually.
It's not actually your ComboBox controls that are named "ComboBox_SelectionChanged_1" and "ComboBox_SelectionChanged". The first combobox' name (x:Name) is "race_dropdown" and the second doesn't have a name (UI controls don't need explicit names in WPF).
"ComboBox_SelectionChanged(_1)" are just the default names of the methods that handle the comboboxes' SelectionChanged events. If you give a combobox a name (e.g. x:Name="asdf") before you double-click it, you will get a slighly better event handler name (e.g. "asdf_SelectionChanged").
Now, to answer your question: You can always change the names later on by renaming the method in the code-behind (CS code) and type the same name in the SelectionChanged property in xaml (WPF code).
Related
Using the menu control in a xaml window, I have this annoying white space between the window border and the docking panel.
The menu itself is inside a stackpanel:
<Window x:Class="COZView.Shell"
xmlns:ad="clr-namespace:AvalonDock;assembly=AvalonDock"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:sc="clr-namespace:COZView.StaticContent"
xmlns:ve="clr-namespace:COZView.View_Edit"
Title="COZView" Width="1024" Height="800" Icon="/COZView;component/Images/COZView.png"
Loaded="OnLoaded" IsVisibleChanged="isVisibleChanged" Closing="OnClosing">
<Grid x:Name="ShellRegion">
<StackPanel Height="Auto" Orientation="Vertical">
<Menu x:Name="menu">
<!-- MENU ITEMS REMOVED -->
</Menu>
<Grid x:Name="DockingRegion" >
<ad:DockingManager x:Name="DockManager">
<ad:ResizingPanel>
<ad:DocumentPane Margin="0,0,0,0">
<sc:StartPage Title="Home Page" VerticalContentAlignment="Stretch"
onProjectOpenFail="StartPage_onProjectOpenFail"
onProjectOpenSuccess="StartPage_onProjectOpenSuccess"
onProjectCreateSuccess="StartPage_onProjectCreateSuccess"
onProjectCreateFail="StartPage_onProjectCreateFail"/>
</ad:DocumentPane>
<ad:DockablePane ad:ResizingPanel.ResizeWidth="300" x:Name="ExplorerPane" FontSize="14" FontWeight="Bold">
<sc:AboutTab x:Name="about" Title="About" FontSize="14" FontWeight="Bold"/>
<sc:ProcessExplorer x:Name="pxProcessExplorer" Title="Process Explorer" FontSize="14"/>
<sc:DataExplorer x:Name="adDataExplorer" Title="Data Explorer" FontSize="14"/>
<!--<sc:UREPExplorer x:Name="adUREPExplorer" Title="UREP Custom Navigation" FontSize="14" Visibility="Hidden"/>-->
</ad:DockablePane>
</ad:ResizingPanel>
</ad:DockingManager>
</Grid>
</StackPanel>
</Grid>
How do i remove the white space? Do I have to surrond it in something? Should the menu be in a different container?
Its just the default menu style where Background is defined as
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStop Color="#FFF6F6F6" Offset="0.25" />
<GradientStop Color="#FFEAE8E8" Offset="0.25" />
<GradientStop Color="#FFDCD9D9" Offset="0.8" />
<GradientStop Color="#FFFFFFFF" Offset="1" />
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
Define a different background if you dont like the #FFFFFFFF bottom line.
I have a common popup in my wpf window and I have a button in the datagrid as well. What I want is to open the popup when the button is clicked. The popup should be independent to each button click. For example, let's say that I have two rows in the datagrid. When I click on the first button popup should appear,then I do some changes to that popup and close it. Now I click the second button it should open a new popup instead of the changes I made before. I'm using a common popup for this. Please anyone tell me is it possible to handle my requirement with common popup window?
XAML
<Popup x:Name="popUpServer" IsOpen="False" Placement="MousePoint" >
<Border Background="#FFEFF2F3" BorderBrush="Black" BorderThickness="1" Width="229" Height="145">
<StackPanel Orientation="Horizontal" Margin="0,0,0,-17">
<Grid Width="227" Margin="0,0,0,10">
<GroupBox Header="Configuration" HorizontalAlignment="Left" Margin="9,6,-9,0" VerticalAlignment="Top" Height="125" Width="211">
<Grid>
<Label Content="Auto Restart" HorizontalAlignment="Left" Margin="10,6,0,0" VerticalAlignment="Top"/>
<ToggleSwitch:HorizontalToggleSwitch x:Name="tsAutoRestart" HorizontalAlignment="Left" Margin="97,10,0,0" VerticalAlignment="Top" Width="46" ThumbSize="22" Height="21" RenderTransformOrigin="3.522,1.048">
<ToggleSwitch:HorizontalToggleSwitch.UncheckedBackground>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFC80000" Offset="1"/>
<GradientStop Color="#FF0A0A0A" Offset="0.853"/>
</LinearGradientBrush>
</ToggleSwitch:HorizontalToggleSwitch.UncheckedBackground>
<ToggleSwitch:HorizontalToggleSwitch.CheckedBackground>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#000000" />
<GradientStop Color="#000000" Offset="1" />
</LinearGradientBrush>
</ToggleSwitch:HorizontalToggleSwitch.CheckedBackground>
<ToggleSwitch:HorizontalToggleSwitch.ThumbBrush>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFD6D4D4" />
<GradientStop Color="#FFD6D4D4" Offset="1" />
<GradientStop Color="#FFD6D4D4" Offset="0.02" />
</LinearGradientBrush>
</ToggleSwitch:HorizontalToggleSwitch.ThumbBrush>
</ToggleSwitch:HorizontalToggleSwitch>
<ComboBox x:Name="cbDuration" HorizontalAlignment="Left" VerticalAlignment="Top" Width="92" Margin="97,40,0,0">
<ComboBoxItem Content="30 Minutes"/>
<ComboBoxItem Content="1 Hours"/>
<ComboBoxItem Content="2 Hours"/>
</ComboBox>
<Label Content="After" HorizontalAlignment="Left" VerticalAlignment="Top" Width="83" Margin="9,36,0,0"/>
<Button x:Name="btnApply" Content="Apply" HorizontalAlignment="Left" Margin="125,75,0,0" VerticalAlignment="Top" Width="64" Click="BtnApply_Click"/>
</Grid>
</GroupBox>
</Grid>
</StackPanel>
</Border>
</Popup>
Datagrid
<DataGridTemplateColumn>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel>
<Button x:Name="txtServerInfo" Click="TxtServerInfo_Click" Height="23" Width="28">
<Button.Background>
<ImageBrush ImageSource="img.png"/>
</Button.Background>
</Button>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
Code behind file
private void TxtServerInfo_Click(object sender, RoutedEventArgs e)
{
popUpServer.IsOpen = true;
}
If you want to use a common popup means better create a popup in a separate user control.then for a button click you can create a new object for the user control and then open the popup by using the user controls object.then the values inside the popup will be independent of the previous button click.
please try the next solution; combine your popup with the button into a separate user control, in that way you can trigger the popup opening based on the button click, and for each button click there will be it's(button) own popup opened there. When you combine the popup and the button together they will have the same data context, thus you will have no problem to make a binding, from the other hand if you want a different data contexts for these controls you can support the user with two dependency properties form that a combined user control.
I'll glad to help if you will have problems with the code, let me know about that.
Regards.
I did some research about the listbox but i didnt understand how to solve my problem.
I have a Listbox in my xaml page and i want to add now a listviewitem using the Template (so i get toggle button and so on) not in xaml and with the help of c#. How do i do this? Thx for your help
<ListBox x:Name="Listbox" Background="Red">
<ListBox.ItemTemplate >
<DataTemplate>
<Grid x:Name="TemplateGrid">
<ToggleSwitch x:Name="Toggle" Foreground="Black">
<ToggleSwitch.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="Black" Offset="1"/>
</LinearGradientBrush>
</ToggleSwitch.Background>
</ToggleSwitch>
<TextBlock HorizontalAlignment="Right" VerticalAlignment="Center" Width="26" x:Name="Text" Foreground="Black">Test</TextBlock>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
The listbox will use the template automatically. From your code, just call Listbox.Items.Add(obj). One thing to note though - in your data template I don't see that you are specifying a datatype for your data template to target, so it will use a generic display by calling ToString() on your object.
I have a window, in which a have a rectangle. I want its fill to be a gradientstop for another rectangle fill, but on different window. The "source" window is defined as:
<Window x:Class="WPF1.ColorSelectorWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:my="clr-namespace:WPF1"
x:Name="colorSelectorWindow"
Title="ColorSelectorWindow" Height="281" Width="540">
There's a rectangle
<Rectangle HorizontalAlignment="Left" Margin="40,120,0,41" Stroke="Black" Width="100" Name="ColorPicker">
<Rectangle.Fill>
<SolidColorBrush>
<SolidColorBrush.Color>
...
</SolidColorBrush.Color>
</SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
and a property:
public partial class ColorSelectorWindow : Window
{
public Brush SelectedBrush
{
get
{
return ColorPicker.Fill;
}
}
}
Now, in the target window, I define a rectangle:
<Rectangle Height="213" HorizontalAlignment="Left" Margin="27,8,0,0" Name="rectangle1" VerticalAlignment="Top" Width="25" Grid.Row="1">
<Rectangle.Fill>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
<GradientStop Offset="0" Color="Blue" />
<GradientStop Offset="1" Color="{Binding ElementName=colorWindowSelector, Path=SelectedBrush, Converter={StaticResource BrushToColorConverter}}" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
where BrushToColorConverter converts Brush to Color. This isn't working and I don't know why, it seems I have a problem with addressing that "source" window.. I'm building it in the target window constructor:
public MainWindow()
{
colorWindow = new ColorSelectorWindow();
colorWindow.Name = "colorWindowSelector";
colorWindow.Hide();
InitializeComponent();
}
I'm only hiding and showing it, not closing for sure. How to bind it properly?
You need to have property exposed SelectedBrush on your MainWindow and you just need to bind to the color of this Brush using RelativeSource. So, this will do for you -
<Rectangle Height="213" HorizontalAlignment="Left" Margin="27,8,0,0" Name="rectangle1" VerticalAlignment="Top" Width="25" Grid.Row="1">
<Rectangle.Fill>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
<GradientStop Offset="0" Color="Blue" />
<GradientStop Offset="1" Color="{Binding Path=Owner.SelectedBrush, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType =Window} Converter={StaticResource BrushToColorConverter}}" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
But make sure while creating the window, you set its owner to be MainWindow -
public MainWindow()
{
InitializeComponent();
colorWindow = new ColorSelectorWindow();
colorWindow.Name = "colorWindowSelector";
colorWindow.Owner = this;
colorWindow.Hide();
}
I have a Silverlight 3 image rotator that displays approx.7 images. You can rotate it back and forth, and it will make the left or right image the selected image. The rotator is using jpg images that resides in an image folder. I would like to dynamically load image strings from the database, since I have hundreds of images available. My question is: How can I load a list or collection based on a query, convert the image strings into Pictures and load them into the rotator dynamically. here is what I have now.
XAML
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:vc="clr-namespace:Visifire.Charts;assembly=SLVisifire.Charts"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:CollectionFlow="clr-namespace:CollectionFlow;assembly=CollectionFlow"
x:Class="CollectionFlowSample.MainPage"
d:DesignWidth="640" d:DesignHeight="480" Loaded="UserControl_Loaded" Width="900" Height="800">
<UserControl.Resources>
<DataTemplate x:Key="DataTemplate1">
<Grid RenderTransformOrigin="0.5,0.5">
<Grid.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform Y="100"/>
</TransformGroup>
</Grid.RenderTransform>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition Height="5"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Border Height="180"
HorizontalAlignment="Left" VerticalAlignment="Top"
Width="140" BorderThickness="10" Margin="16,14,0,0"
CornerRadius="2">
<Border.BorderBrush>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="#FF282323" Offset="1"/>
<GradientStop Color="#FF413636" Offset="0.556"/>
<GradientStop Color="#FFCEBABA" Offset="0.83"/>
</LinearGradientBrush>
</Border.BorderBrush>
<Image Source="{Binding Mode=OneWay}" Stretch="Fill" >
<Image.Effect>
<DropShadowEffect ShadowDepth="0" BlurRadius="3" Opacity="0.5"/>
</Image.Effect>
</Image>
</Border>
<Image Source="{Binding Mode=OneWay}" Grid.Row="2" RenderTransformOrigin="0.5,0.5">
<Image.Effect>
<BlurEffect/>
</Image.Effect>
<Image.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Offset="0.5"/>
<GradientStop Offset="1" Color="#7F000000"/>
</LinearGradientBrush>
</Image.OpacityMask>
<Image.RenderTransform>
<TransformGroup>
<ScaleTransform ScaleY="-1"/>
<SkewTransform AngleX="0" AngleY="0"/>
<RotateTransform Angle="0"/>
<TranslateTransform/>
</TransformGroup>
</Image.RenderTransform>
</Image>
</Grid>
</DataTemplate>
<ItemsPanelTemplate x:Key="ItemsPanelTemplate1">
<CollectionFlow:CollectionFlowPanel ItemHeight="400" ItemWidth="160" FocusedItemOffset="60" UnfocusedItemOffset="40" ItemVisibility="5" RenderTransformOrigin="0.5,0.5"/>
</ItemsPanelTemplate>
</UserControl.Resources>
<Grid x:Name="LayoutRoot">
<Grid.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFA0A0A0" Offset="0"/>
<GradientStop Color="Black" Offset="1"/>
</LinearGradientBrush>
</Grid.Background>
<CollectionFlow:CollectionFlow x:Name="ImageList" ItemTemplate="{StaticResource DataTemplate1}" ItemsPanel="{StaticResource ItemsPanelTemplate1}">
<CollectionFlow:CollectionFlow.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFEAE2E2"/>
<GradientStop Color="#FF0E0101" Offset="1"/>
<GradientStop Color="#FF676464" Offset="0.665"/>
</LinearGradientBrush>
</CollectionFlow:CollectionFlow.Background>
</CollectionFlow:CollectionFlow>
C# code
ImageList.ItemsSource = new string[] {"SampleImages/10019436.jpg","SampleImages/10042172.jpg" etc...
Here is what like to do.....
Query Database get records back and then...
use the conversion function process...
string sPic = (string)emps.Photo.ToString();
EmpPic1.Source = ConvertBase64ToImage(sPic);
public BitmapImage ConvertBase64ToImage(string base64String)
{
//Convert Base64 String to byte[]
byte[] imageBytes = Convert.FromBase64String(base64String);
BitmapImage bi = new BitmapImage();
bi.SetSource(new MemoryStream(imageBytes));
return bi;
}
This is where I like to add the queried images to a collection,and use the technique described above to dispaly them in the image rotator.
Any help would be appreciated.
you need to request data using a web server (through a web service call is a good way of achieving this) this will return the data to your silverlight application, you wont be able to connect to a database directly with silverlight, your service will access the database and it can then return the data to your application to be consumed by the code you discussed above.
Create a web service that returns the image data
add a web reference to your silverlight application that points to your service
use the generated proxy to call the service and return the data to your application
- you could either use the serviceclient of the proxy with an asynchronous call back or forget the proxy and just call the service using webclient
i think its important to understand the client based nature of silverlight, it lives in a sandbox on a remote computer in its most typical use case, so accessing data doesnt use the same approach as say a windows forms application>