That's me again with my bindings :)
Here is the problem, I need to have on my GRID two controls connected with a LINE. So I can move with mouse one of the controls around GRID and LINE, that connect this two controls must replace immediately while moving.
Any ideas? I thought that calculate new X1,Y1,X2,Y2 of the LINE on every 1px move impossible and very speedless... So I think that there is the way to create BINDINGS for LINE's X1,Y1,X2,Y2, such as:
x1={Binding firstCtrl.Position.X+firstCtrl.Width/2}
But such binding is very hard (for me) even in XAML, but I need to create such binding dynamically in C# code.
Need your advice again, how to create such binding in C# or there is another way to realize my idea?
P.S."I don't need whole code for that, just description and, maybe, simple example of code."
Thanks a lot.
You could use a MultiValueConverter to gather the points of interest and return the X or Y point as needed.
Here is a good blog post discussing their use.
Try this:
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<ResourceDictionary>
<ControlTemplate x:Key="template1">
<Ellipse Width="30" Margin="-15 -15" Height="30" Fill="Black"/>
</ControlTemplate>
</ResourceDictionary>
</Window.Resources>
<Canvas Name="myCanvas">
<Thumb Name="myThumb" DragDelta="onDragDelta" Canvas.Left="0" Canvas.Top="30" Template="{StaticResource template1}"/>
<Thumb Name="myThumb2" DragDelta="onDragDelta" Canvas.Left="400" Canvas.Top="30" Template="{StaticResource template1}"/>
<Line X1="{Binding ElementName=myThumb,Path=(Canvas.Left)}" Y1="{Binding ElementName=myThumb,Path=(Canvas.Top)}" X2="{Binding ElementName=myThumb2,Path=(Canvas.Left)}" Y2="{Binding ElementName=myThumb2,Path=(Canvas.Top)}" Stroke="Black" />
</Canvas>
code behind:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Controls.Primitives;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace WpfApplication1
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
void onDragDelta(object sender, DragDeltaEventArgs e)
{
var i = sender as UIElement;
if (i != null)
{
Canvas.SetLeft(i, Canvas.GetLeft(i) + e.HorizontalChange);
//Canvas.SetTop(myThumb, Canvas.GetTop(myThumb) + e.VerticalChange);
}
}
}
}
EDIT:
Explanation: this has two draggable circles (x-axis only) and a line connecting both. I've created a binding for the X-Num,Y-Num properties and bound them to the Canvas.Top/Left attached properties of the thumb objects (using ElementName Binding). This places both ends of the line in the 0,0 coords of each object. So I used a negative margin to put the circle's center in 0,0.
Hope that helps.
Related
This question already has answers here:
How to make the animation smoother through code in WPF?
(3 answers)
WPF: Animation is not smooth
(1 answer)
WPF Jitters with TranslateTransform and Canvas.SetLeft
(1 answer)
Why creating non storyboard animation is not smooth
(1 answer)
Closed 5 years ago.
The following text block ticker animation is not smooth at all. So need some guidance on how to make this double animation smoother for more user friendliness as I will be integrating RSS news feed in there after that.
XAML CODE:
<Window x:Class="Wpf_Marquee.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:Wpf_Marquee"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Canvas Margin="50" Canvas.Left="150" Canvas.Top="100" ClipToBounds="True" Name="canMain" Background="Red" Height="100" Width="400" >
<TextBlock x:Name="marquee" Margin="0 50 0 0" FontSize="20pt" Foreground="Black" Background="Transparent" Canvas.Left="0" Canvas.Right="68">
Hello This is a Sample Marquee in Wpf. Please check the animation
</TextBlock>
<Button x:Name="btn1" Width="50" Height="50" Content="Marquee" Click="Button_Click" />
</Canvas>
Where as my .CS code is as follows
using System;
using System.Collections.Generic;
using System.Linq;
using System.ServiceModel.Syndication;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Automation.Peers;
using System.Windows.Automation.Provider;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Xml;
namespace Wpf_Marquee
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
public void Button_Click(object sender, RoutedEventArgs e)
{
DoubleAnimation doubleAnimation = new DoubleAnimation();
doubleAnimation.From = this.ActualWidth;
doubleAnimation.To = -marquee.ActualWidth;
doubleAnimation.RepeatBehavior = RepeatBehavior.Forever;
doubleAnimation.Duration = new Duration(TimeSpan.FromSeconds(2060)); // provide an appropriate duration
marquee.BeginAnimation(Canvas.LeftProperty, doubleAnimation);
}
}
}
Thanks in advance for your help :)
I am trying to implement the ability to click through only part of a transparent background. The background image is a solid gray and has 3 circles, a rectangle, and an oval shape. The image is transparent. Button 1 appears inside of the rectangle and button 2 appears inside of the oval. When the program runs both buttons are visible but currently not clickable because the image is in a grid and added after the buttons. I would like to make only the rectangle click through so button 1 can be clicked, but still keep the image ahead of button 2 so it is not clickable.
I've searched around quite a bit for a solution but have not found what I'm looking for. This example is a dumbed down version of what I'm currently working on - but the functionality is essentially the same. Any help would be appreciated.
Xaml:
<Window x:Class="TransparentClickThrough.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Button x:Name="ButtonOne" Click="ButtonOne_Click" Content="Button1" Width="50" Height="25" ></Button>
<Button x:Name="ButtonTwo" Content="Button2" Width="50" Height="25" Margin="379,100,59,148" Click="ButtonTwo_Click"></Button>
<Image Source="/TransparentClickThrough;component/background.png" />
</Grid>
</Window>
Code behind:
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 TransparentClickThrough
{
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void ButtonOne_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("You clicked button 1!");
}
private void ButtonTwo_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("You clicked button 2!");
}
}
}
background - 3 circles, rectangle, and oval are all set to transparent
This is what the program looks like when running.
I was able to just add a Rectangle with transparent fill to the grid. Then I added an event "MouseDown" Interaction trigger to toggle the Visibility through a DataTrigger which in turn changed the background color.
Similar to this link link
I am a complete "weekend warrior" to programming so go gentle on me, please...
I want to achieve a simple task, which I had no problem with in plain C# (TextBox.Text = "Something";)
I have a textbox and a textblock in XAML, and I want to populate them from C#, simple as that - run the web app and pull the predefined strings from the C# code. I have been searching for 2 days now and can't find a straight answer. I don't want any triggers (buttons), just filling e.g. textbox on load with a C# string. A simple code example on both XAML and C# side would be greatly appreciated!
Cheers,
Sasa
Not sure if I'm understanding your question...
<!--xaml-->
<TextBox x:Name="txtMyTextBox"/>
// C#
// Window constructor
public MyWindow()
{
InitializeComponent();
txtMyTextBox.Text = "Something";
}
One simple way to achieve what you try to achieve (if I understood correctly), is to add the UI elements to your window and set a Name for each of them. This way, you can access them in your code-behind as seen below.
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525" Loaded="Window_Loaded">
<Grid>
<TextBox Name="TextBox1" HorizontalAlignment="Left" Height="23" Margin="37,37,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="120"/>
<TextBlock Name="TextBlock1" HorizontalAlignment="Left" Margin="48,100,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Height="103" Width="239"/>
</Grid>
</Window>
While there are certainly more "refined" ways to achieve the same, once you named your UI elements in xaml, you can access them just as other object instances in your code-behind.
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 WpfApplication1
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void Window_Loaded(object sender, RoutedEventArgs e)
{
TextBox1.Text = "Hello TextBox1!";
TextBlock1.Text = "Hello TextBlock1!";
}
}
}
Let's say, I create a page MyPage in a WPF application MyApp with Visual Studio 2012 Express.
Very often, when I try to access newly created elements of MyPage.xaml in MyPage.xaml.cs, I get an error message like
The name “group_combobox” does not exist in the current context
This happens even though other elements of the same page / the same context do exist and are available in my C# sharp code editor window.
To give you an example of the problem, see the following MyPage.xaml and MyPage.xaml.cs which are returning the error message, when editing the MyPage.xaml.cs file:
MyPage.xaml
<Page x:Class="MyApp.MyPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="768" d:DesignWidth="1024"
Title="MyApp - MyPage" Width="Auto" Height="Auto">
<Button x:Name="MyPage_back_button" Content="Back" Margin="10,100,10,0" VerticalAlignment="Top" FontSize="24" Height="50"/>
<StackPanel Margin="0" x:Name="settings_stackpanel">
<GroupBox Header="Group" VerticalAlignment="Top" FontSize="24" Margin="10" Height="100">
<ComboBox x:Name="group_combobox" Height="62" VerticalAlignment="Top" Margin="0" BorderBrush="{x:Null}" Background="{x:Null}" VerticalContentAlignment="Center"/>
</GroupBox>
</StackPanel>
</Page>
MyPage.xaml.cs
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Text;
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 MyApp
{
public partial class MyPage : Page
{
public MyPage()
{
Debug.WriteLine("MyPage");
InitializeComponent();
group_combobox.Items.Clear(); // <-- error: The name “group_combobox” does not exist in the current context
string test = MyPage_back_button.ToString(); // <-- no error
}
}
}
As you can see, the error is only thrown for one of two elements from the same page. I think, there is somehow somewhere described how this "context" looks and what it contains. And at a certain point there is some kind of "synchronization" or something like that.
I noticed this behaviour before, and it solved "magically" that I think I somehow accidentally fired that trigger or the mechanism that is responsible for this synchronization.
Do you know how to trigger that kind of synchronization and how to access the information about "the current context"?
p.s. Rebuilding the project did not solve the problem
I'm going round in circles here. I've kind of got the hang of XmlDataProvider bindings but the file I'm using seems too large to bind dynamically (50Mb doesn't work; 2Mb works). So instead I have the data loaded into classes using code generated from the XSD.
However, I can't get binding to CLR objects to work, due to my lack of knowledge. I'm using Visual Studio 2008 Pro, C# and .Net 3.5.
Here's the XAML file:
<Window x:Class="WpfObjectText.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfObjectText"
Title="Window1" Height="300" Width="300">
<Grid>
<Grid.Resources>
<ObjectDataProvider x:Key="simpleBinding" ObjectType="{x:Type local:ExampleClass}"/>
</Grid.Resources>
<StackPanel>
<TextBox Name="textBox1" Text="{Binding Path=simpleBinding}" />
</StackPanel>
</Grid>
</Window>
And the code behind:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
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 WpfObjectText
{
/// <summary>
/// Interaction logic for Window1.xaml
/// </summary>
public partial class Window1 : Window
{
public ExampleClass TestInstance = new ExampleClass("Hello, world!");
public Window1()
{
InitializeComponent();
}
}
public class ExampleClass
{
public string TestString { get; set; }
public ExampleClass(string initialText)
{
TestString = initialText;
}
}
}
I've deliberately kept it simple so I can take baby steps. All I want to do here is populate the textbox from an instance of ExampleClass, and have the TestString field updated if the textbox changes (ie bidirectional). I know I can set MethodName in the binding which works to a certain extent in ListBoxes but that doesn't seem to imply bidirectional to me. Coming from a Delphi7 Win32 programmer, this is alien territory for me!
Assistance appreciated.
These are the necessary changes:
<TextBox Name="textBox1" Text="{Binding Path=TestString}" />
and then in the constructor:
DataContext = TestInstance;
If my understanding of the question is correct, you don't need Grid.Resources section at all.