WPF Bitmap effect error on image source - c#

What I am trying to do is use the Imagebox as source for my bitmap effect and i dont know how to do that.My imagebox is called image1 .
<Button Content="Blur" Height="23" HorizontalAlignment="Left" Margin="148,12,0,0" Name="button3" VerticalAlignment="Top" Width="42" Click="button3_Click" >
<Image Source ="image1">
<Image.BitmapEffect>
<BlurBitmapEffect Radius="5" />
</Image.BitmapEffect>
</Image>
</Button>

Are you using MVVM? If not, I highly recommend using this pattern because WPF is built to use it and if you don't, you will fight it all the way.
Create a ViewModel class. Create a public property of type Image in this ViewModel class.
Create an instace of the ViewModel and put it into your Window's datacontext. Then add a binding to this property.
Alternatively for a quick fix (please note that this leads to darkness, you will regret having started to program this way):
<Image Source="{Binding Source, ElementName=image1}">
Edit:
Your edit is a completely different story: You have set the Content property twice: once by directly setting it and once by having a child object. Your button has both a text and an image as content. But a button (and most other controls) can only have one content. If you want both, your content needs to be a container control like a StackPanel that can have multiple contents and you need to put both your Image and your TextBlock in there.
Example (you need to put in Orientation and Alignment as you see fit):
<Button Height="23" HorizontalAlignment="Left" Margin="148,12,0,0" Name="button3" VerticalAlignment="Top" Width="42" Click="button3_Click">
<StackPanel>
<TextBlock Text="Test"/>
<Image Source="{Binding Source, ElementName=image1}">
<Image.BitmapEffect>
<BlurBitmapEffect Radius="5" />
</Image.BitmapEffect>
</Image>
</Button>

Related

How do I access the content in TabControl.ContentTemplate in the c#back code?

I write a vector editor. Before I started using TabControl, everything worked for me. However, it became necessary to upload several open files simultaneously. Each open file is displayed on TabItem. As a result of chatting on forums, I found out that you need to create an MVVM to correctly display data from different different files. I was advised to Set a common template for all tabs. By adding items to the collection that TabControl is linked to, tabs will be created automatically using this template. I did the following:
<TabControl x:Name="Drawing_TabControl" Grid.Row="0" Background="WhiteSmoke"
SelectionChanged="Drawing_TabControl_SelectionChanged">
<TabControl.ContentTemplate>
<DataTemplate>
<Grid x:Name="Drawing_Grid_Tab"
Background="WhiteSmoke">
<Canvas x:Name="coordinateCanvas_Tab"
Background="GhostWhite"
Height="6cm"
Width="16cm"
HorizontalAlignment="Center"
VerticalAlignment="Center"></Canvas>
<Canvas x:Name="gridCanvas_Tab"
Background="Transparent"
Height="6cm"
Width="16cm"
HorizontalAlignment="Center"
VerticalAlignment="Center"
SizeChanged="gridCanvas_SizeChanged"></Canvas>
<Border x:Name="drawing_Border_Tab"
BorderBrush="Black"
BorderThickness="0.5 0.5 0.5 0.5"
Height="4cm"
Width="14cm"
HorizontalAlignment="Center"
VerticalAlignment="Center"></Border>
<Canvas x:Name="drawing_gridCanvas_Tab"
Background="White"
Height="4cm"
Width="14cm"
HorizontalAlignment="Center"
VerticalAlignment="Center"></Canvas>
<Canvas x:Name="drawing_tempCanvas_Tab"
Background="Transparent"
Height="4cm"
Width="14cm"
HorizontalAlignment="Center"
VerticalAlignment="Center"></Canvas>
<Canvas x:Name="drawingCanvas_Tab"
Background="Transparent"
Height="4cm"
Width="14cm"
HorizontalAlignment="Center"
VerticalAlignment="Center"
ClipToBounds="True"></Canvas>
</Grid>
</DataTemplate>
</TabControl.ContentTemplate>
<TabItem x:Name="drawTabItem1"
Header="Макет_1" Background="WhiteSmoke">
</TabItem>
</TabControl>[enter image description here][1]
How can I access x:Name="coordinateCanvas_Tab" in the back code, for example?
If you've been advised and have implement that advice to change to an MVVM code structure then you do not access the XAML component directly from the code behind file anymore.
Instead you need to wire up a two way binding between your View XAML and the ViewModel you are using.
This is primarily done by utilising the BindingContext object in the view after the screen is initialized in your constructor code behind.
After that you can then assign values to a Collection object in your ViewModel and bind to it in the XAML. To do the dynamic tab insertion you want to do you can make use of the BindableLayout attribute then in the ItemTemplate bind values for each tab from the collection objects.
Have a look at this guide for a better understanding of Bindings.
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/xaml/xaml-basics/data-bindings-to-mvvm

How to set the background color of a label in WPF?

I have a label but setting the Background property not seem to do anything:
<Label Content="{Binding Name, Source={StaticResource LocStrings}}"
HorizontalAlignment="Left" Margin="4" Name="label2" Background="Blue"
VerticalAlignment="Top"/>
This does not show a blue background (while the property Background is recognized.
Also when using the Label.Background 'way' I do not see a blue background.
Update:
I used the following minimalistic code:
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
Title="TEST" SizeToContent="WidthAndHeight">
<Grid>
<Label Content="TEXT TO TEST" Foreground="Green" Background="Orange"/>
</Grid>
</Window>
What I see is the tekst in green but without any orange background.
<Label Content="{Binding Name, Source={StaticResource LocStrings}}"
HorizontalAlignment="Stretch" Margin="4" Name="label2" Background="Blue"
VerticalAlignment="Top"/>
Have you tried to just enter some text in the Content and checked the binding output, maybe there is something wrong with your binding. Because it works just fine here.
Note that I set HorizontalAlignment="Stretch" instead of left, which will make the label use all the horizontal avaliable space. If you don't have anything bound your label will be invisible in your case above, you may use this in combination with the output to figure out what's likely wrong with your binding as stated by others, like Sriram Sakthivel and PoweredByOrange. For helping you with that, we need a bit more information :)
Hope it helps,
Cheers,
Stian
Since you are binding to a string value so using a TextBlock instead of Label is worth here. A content model of Label may not be required in this scenario.
here is an example
<TextBlock Text="{Binding Name, Source={StaticResource LocStrings}}"
HorizontalAlignment="Left" Margin="4" Name="label2" Background="Blue"
VerticalAlignment="Top"/>
some other benefits of displaying text in a TextBlock instead of a Label
Unlike a Label a Textblock is derived directly from FrameworkElement instead of deriving from a Control thus making it lightweight.
A Label follows content model so the appearance may get affected by the content and its type and / or any style or template defined for the same.
read here for more Differences between Label and TextBlock

How to fill the image 100% inside a button

It should be simple but somehow I am getting problems to do it in a more generic way (without width and height properties).
I have a button and an image inside this button but when I insert an image I see the it is not 100% filled.
This is my code:
<Button Grid.Row="0" Grid.Column="1"
Style="{StaticResource BrowseButtonStyle}"
Click="ChangeLogo_Click">
<Image x:Name="imageControl" />
</Button>
How can I fill it?
If you go take a look at a copy of the default Button template you'll see the ContentPresenter has its Margin Template bound via a Setter with a "Padding" of 12,4 by default.
So easiest answer, just specify a zero padding.
<Button Grid.Row="0" Grid.Column="1"
Style="{StaticResource BrowseButtonStyle}"
Click="ChangeLogo_Click"
Padding="0">
<Image x:Name="imageControl" />
</Button>
Hope this helps.

How to change the content control Content in WPF?

In my project I have fixed header & footer, and changeable content. so i have put ContentControl in my window.
<Grid>
<Canvas Name="canvas_Logo" HorizontalAlignment="Center" VerticalAlignment="Top" Width="180">
<Image Source="Images/k1.png" Grid.Row="1" Width="180" />
</Canvas>
<ContentControl VerticalAlignment="Center" Name="CC1" Grid.Row="2" Height="450"/>
<Canvas x:Name="canvas_Marque" ClipToBounds="True" Height="60" HorizontalAlignment="Center" VerticalAlignment="Bottom" Width="1022" Background="DarkRed" />
</Grid>
It look like this...
I have create two user control name page1, page2. Page 1 has a button, when i click the button ContentControl has show page2.
so i have write the below code in button1_Click
MainPage n = new MainPage();
n.CC1.Content = new Page2();
But at the time of button click ContentControl not changed what can i do for that?
My page1 xaml
<Grid Background="AliceBlue">
<Label Content="Child1" Height="28" HorizontalAlignment="Left" Margin="74,65,0,0" Name="label1" VerticalAlignment="Top" Width="157" />
<Button Content="load page2 and destroy this" Height="31" HorizontalAlignment="Left" Margin="79,124,0,0" Name="button1" VerticalAlignment="Top" Width="186" Click="button1_Click" />
</Grid>
page2 xaml
<Grid Background="CadetBlue">
<Label Content="This is page 2" Height="28" HorizontalAlignment="Left" Margin="96,82,0,0" Name="label1" VerticalAlignment="Top" Width="148" />
</Grid>
How to change the content control Content in WPF?
Ah, my friend ... we meet again ... Good to see you're making progress on your project...
Now, my next suggestion would be: Don't do these things from the code behind ... Let the XAML binding to it's work ...
Usually, Using MVVM, you'll have your content control source binding on a property of a base view model type. So, let's assume VM1 and VM2 both extend BasicViewModel, and you have a property defined like this:
Public BasicViewModel Current_VM {get;set;}
Now, all you need to do when you want to swap, is change the Current_VM from VM1 to VM2, and the binding will do the rest, updating your window to the correct view (assuming you have the data templates set .. but you never said if you're using MVVM or not ...)
You cannot instantiate a new MainPage from the Page1 UserControl, since MainPage is already the host of Page1 (if I understand you right). If you're going to manage pages from the code-behing (not the best practice ref. #Noctis), you must do all the work from the MainPage.xaml.cs in this case. You must then find some way to pass arguments back to MainPage in order to change the content.
Usually this is done in a ViewModel, as #Noctis says.

How to programmatically replace the icon of a TreeViewItem?

In my current project I've got a WPF TreeView and added items like this:
<TreeViewItem Name="treeViewItem6" IsEnabled="False">
<TreeViewItem.Header>
<StackPanel Orientation="Horizontal">
<Image Height="16" Source="Images/16x16_green_lamp.png" Width="16" />
<TextBlock Margin="5,0" Text="Status: Connected" />
</StackPanel>
</TreeViewItem.Header>
</TreeViewItem>
I would like to replace an icon as well as the text of a TextBlock in my C# code to make it look like this:
Is there an easy way to programmatically replace the icon as well as the text of a TreeViewItem or do I have to iterate through the entire tree of sub items? (Unfortunately I'm a WPF novice and I'm more used to the good old WinForms)
To change the source of the image and the text of a textblock you can give the controls a name like this:
<Image Name="imgIcon" Height="16" Source="Images/16x16_green_lamp.png" Width="16" />
<TextBlock Name="tbStatus" Margin="5,0" Text="Status: Connected" />
That way you can change the properties you want to change easily programmatically, like this:
Image img = FindResource("red") as Image;
if (img != null) imgIcon.Source = img.Source;
tbStatus.Text = "Status: Disconnected";
To find the "green" and "red" resources you can add them to the XAML like this:
<Window.Resources>
<Image x:Key="green" Source="Images/16x16_green_lamp.png" />
<Image x:Key="red" Source="Images/16x16_red_lamp.png" />
</Window.Resources>
Of course you will need additional logic to determine the status, but this will get you started.
Instead of hardcoding the path to your image you can actually bind the image source to a string property in your ViewModel. The string property needs to represent the uri to the image you want to display. Once you change the string property (and fire the OnPropertyChanged event) your UI will automatically change the image.
WPF has a build in converter for images so you should not worry too much about that. Here is how your binding should look like:
<Image Source="{Binding ImageSource}" />
Where ItemSource is a string property in your view model.
Hope that helps.
How do you generate the tree? Is there any Data Binding there?
If the tree is constructed manually, why don't you simply give names to the elements that you want to change, and then in code reference those elements:
<TreeViewItem Name="treeViewItem6" IsEnabled="False">
<TreeViewItem.Header>
<StackPanel Orientation="Horizontal">
<Image x:Name="StatusImage" Height="16" Source="Images/16x16_green_lamp.png" Width="16" />
<TextBlock x:Name="StatusText" Margin="5,0" Text="Status: Connected" />
</StackPanel>
</TreeViewItem.Header>
</TreeViewItem>
Then, in C# code:
...
this.StatusImage.Source="..."; // a new ima
this.StatusText.Text = "....;
For the image source, you'll need to generate it (text is not enough):
new BitmapSource( new Uri( "image uri" ) )
You should construct it once and cache it.

Categories

Resources