I am trying to create Rectangle programmaticallyin silverlight as fallows.
C#
private Boolean Working = false;
const int scale = 4;
const int size = 50;
Int32[] data = new Int32[size];
Rectangle[] lines = new Rectangle[size];
private void button1_Click(object sender, RoutedEventArgs e)
{
canvas1.Children.Clear();
for (int i = 0; i < data.Length; i++)
{
data[i] = i;
lines[i] = new Rectangle()
{
Height=i*scale,
Width = 10,
StrokeThickness=5,
Stroke = new SolidColorBrush(Colors.Red),
Name=i.ToString(),
};
canvas1.Children.Add(lines[i]);
}
}
Now the problem is that all the rectangle are created with the same height and width?.
XAML
<UserControl x:Class="SilverlightApplication1.MainPage"
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"
d:DesignHeight="500" d:DesignWidth="500">
<Canvas x:Name="canvas2" Background="White">
<Canvas x:Name="canvas1" Background="White"></Canvas>
<Button Content=" Generate" Height="38" Name="button1" Width="75" Click="button1_Click" Margin="0,352,245,24" HorizontalAlignment="Right" Canvas.Left="12" Canvas.Top="85" />
<Button Content="Shuffle" Height="38" HorizontalAlignment="Left" Name="button2" Margin="12,352,0,24" Click="button2_Click_1" Canvas.Left="81" Canvas.Top="85" Width="71" />
<Button Canvas.Left="181" Canvas.Top="437" Content="Bubble Sort" Height="38" Name="button3" Width="109" Click="button3_Click" />
</Canvas>
</UserControl>
Screenshot
Actually, everything works fine. All rectangles have different height. But you forget to move them, so they start overlapping. Change a little code and you'll see:
lines[i] = new Rectangle()
{
Height = i * scale,
Width = 10,
StrokeThickness = 5,
Stroke = new SolidColorBrush(Colors.Red),
Name = i.ToString(),
};
lines[i].Margin = new Thickness(11 * i, 0, 0, 0);
Result
Related
I want the user to enter the width and height of the rectangle and I want the rectangle to appear immediately after numbers have been entered. I don't want to have to push any buttons to have the rectangle appear.
I had the rectangle code working when I entered numbers for the height and width but when I changed it to variables from the user input textbox, nothing appears on the screen.
Here's my XAML:
TextBox Text="{Binding xcoord, Mode=OneWay}" Name="x" Grid.Row="1" Height="20" Width="40" Grid.Column="2"></TextBox>
TextBox Text="{Binding ycoord, Mode=OneWay}" Name="y" Grid.Row="2" Height="20" Width="40" Grid.Column="2"></TextBox
Here's my C#:
public FEModel()
{
InitializeComponent();
CreateARectangle();
}
private double xval;
public double xcoord
{
get { return xval; }
}
private double yval;
public double ycoord
{
get { return yval; }
}
public void CreateARectangle()
{
// Creates a Rectangle
Rectangle rect = new Rectangle();
rect.Height = ycoord;
rect.Width = xcoord;
// Create a Brush
SolidColorBrush colorbrush= new SolidColorBrush();
colorbrush.Color = Colors.Red;
colorbrush.Opacity = .3;
SolidColorBrush blackBrush = new SolidColorBrush();
blackBrush.Color = Colors.Black;
// Set Rectangle's width and color
rect.StrokeThickness = 1;
rect.Stroke = blackBrush;
// Fill rectangle with color
rect.Fill =colorbrush;
// Add Rectangle to the Grid.
can.Children.Add(rect);
}
I expect the rectangle to appear on the canvas as soon as the user enters x and y coordinates but instead, nothing happens.
You need to use two way binding for your text boxes.
Here is a fully working sample.
Window Xaml: Note that the default update trigger for textbox is 'LostFocus'. In my example i set to 'PropertyChanged' so the rectangle updates as soon as the user changes a value.
<Window x:Class="WpfApp9.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:WpfApp9"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid Name="can">
<TextBox Text="{Binding xcoord, UpdateSourceTrigger=PropertyChanged}" Name="x" Height="20" Width="40" Margin="40,51,0,0" HorizontalAlignment="Left" VerticalAlignment="Top"/>
<TextBox Text="{Binding ycoord, UpdateSourceTrigger=PropertyChanged}" Name="y" Height="20" Width="40" Margin="40,81,0,0" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>
</Window>
Here is the code behind. I changed the code to adjust the rectangle size rather than creating a new rectangle every time the values are changed.
using System.Windows;
using System.Windows.Media;
using System.Windows.Shapes;
namespace WpfApp9
{
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
DataContext = this;
}
private double xval = 50;
public double xcoord
{
get=> xval;
set
{
xval = value;
CreateARectangle();
}
}
private double yval = 50;
public double ycoord
{
get => yval;
set
{
yval = value;
CreateARectangle();
}
}
Rectangle rect = null;
public void CreateARectangle()
{
if (rect == null)
{
// Creates a Rectangle
rect = new Rectangle();
rect.Height = ycoord;
rect.Width = xcoord;
// Create a Brush
SolidColorBrush colorbrush = new SolidColorBrush();
colorbrush.Color = Colors.Red;
colorbrush.Opacity = .3;
SolidColorBrush blackBrush = new SolidColorBrush();
blackBrush.Color = Colors.Black;
// Set Rectangle's width and color
rect.StrokeThickness = 1;
rect.Stroke = blackBrush;
// Fill rectangle with color
rect.Fill = colorbrush;
// Add Rectangle to the Grid.
can.Children.Add(rect);
}
else
{
rect.Height = ycoord;
rect.Width = xcoord;
}
}
}
}
As a side note you can also create the rectangle in XAML, directly binding to the textbox values.
<TextBox Text="50" Name="x" Height="20" Width="40" Margin="10,10,0,0" HorizontalAlignment="Left" VerticalAlignment="Top"/>
<TextBox Text="50" Name="y" Height="20" Width="40" Margin="10,35,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" RenderTransformOrigin="-0.017,-0.629"/>
<Rectangle Stroke="Black" Fill="#4CFF0000" Margin="60,5,0,0" Width="{Binding ElementName=x, Path=Text, UpdateSourceTrigger=PropertyChanged}" Height="{Binding ElementName=y, Path=Text, UpdateSourceTrigger=PropertyChanged}"/>
I'm quite new to WPF and am trying to build a GUI in Blend, but I'm running into all sorts of issues.
I want my finished product to look like this: https://imgur.com/a/BU8Te
(the red is just a placeholder for icons).
Here is the XAML I've got so far:
<Window x:Class="GUI.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:GUI"
mc:Ignorable="d"
Title="GUI"
Height="840"
Width="920"
WindowStyle="none"
ResizeMode="CanResizeWithGrip"
AllowsTransparency="true"
MouseLeftButtonDown="Window_MouseLeftButtonDown"
WindowStartupLocation="CenterScreen"
Background="Transparent"
MaxWidth="{Binding Source={x:Static SystemParameters.WorkArea}, Path=Width}"
MaxHeight="{Binding Source={x:Static SystemParameters.WorkArea}, Path=Height}">
<Border x:Name="shadow">
<Grid x:Name="grid" Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="20"/>
<RowDefinition Height="100"/>
<RowDefinition Height="2"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Border Grid.Row="0" Background="#F9F9F9" />
<Border Grid.Row="1" Background="#F9F9F9" />
<Border Grid.Row="2" Background="#E9E9E9" />
<DockPanel Grid.Row="0" LastChildFill="False">
<Button x:Name="btnClose"
DockPanel.Dock="Right"
VerticalAlignment="Center"
Height="20" Width="20"
Click="btnClose_Click"
Style="{DynamicResource CloseButton}">
<Path Data="m 357.0883 499.0572 12.62375 12.6275 5.31375 -5.31625 -12.62625 -12.62625 12.62625 -12.61875 -5.31375 -5.3125 -12.62375 12.62 -12.6325 -12.62 -5.30375 5.3125 12.6175 12.61875 -12.6175 12.62625 5.30375 5.31625 12.6325 -12.6275 z" Stretch="Uniform" Fill="#FFAAAAAA" Width="10" Margin="0,0,0,0" ></Path>
</Button>
<Button x:Name="btnMaximise"
DockPanel.Dock="Right"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Height="20" Width="20"
Click="btnMaximise_Click"
Style="{DynamicResource TitleButton}">
<Path Data="M4.3685131,23.127279L4.3685131,47.283243 47.117023,47.283243 47.117023,23.127279z M0,10.684L53.755001,10.684 53.755001,51.668001 0,51.668001z M8.5679998,0L58.668022,0 64,0 64,5.6864691 64,45.317999 58.668022,45.317999 58.668022,5.6864691 8.5679998,5.6864691z"
Stretch="Uniform" Fill="#FFAAAAAA" Width="10" Margin="0,0,0,0" ></Path>
</Button>
<Button x:Name="btnMinimise"
HorizontalAlignment="Center"
VerticalAlignment="Center"
DockPanel.Dock="Right"
Height="20" Width="20"
Click="btnMinimise_Click"
VerticalContentAlignment="Bottom"
Style="{DynamicResource TitleButton}">
<Button.Content>
<Path Data="M0,20L53.333,20 53.333,8.888 0,8.888z"
Stretch="Uniform" Fill="#FFAAAAAA" Width="10" Margin="0,0,0,5"></Path>
</Button.Content>
</Button>
</DockPanel>
</Grid>
</Border>
</Window>
But when I maximise the window, the top left corner is off my screen (-15, -15 maybe?) and the bottom right corner is also too far up and left because of this. I modified some code that I found online (can't remember the source) which fixed this:
private bool isMaximized;
private Rect normalBounds;
private void MainWindow_OnStateChanged(object sender, EventArgs e)
{
if (WindowState == WindowState.Maximized && !isMaximized)
{
// max
WindowState = WindowState.Normal;
isMaximized = true;
normalBounds = RestoreBounds;
Height = SystemParameters.WorkArea.Height;
MaxHeight = Height;
MinHeight = Height;
Top = 0;
Left = 0;
Width = SystemParameters.WorkArea.Width;
SetMovable(false);
}
else if (WindowState == WindowState.Maximized && isMaximized)
{
// min
WindowState = WindowState.Normal;
isMaximized = false;
MaxHeight = Double.PositiveInfinity;
MinHeight = 0;
Top = normalBounds.Top;
Left = normalBounds.Left;
Width = normalBounds.Width;
Height = normalBounds.Height;
SetMovable(true);
}
}
private void SetMovable(bool enable)
{
HwndSource source = HwndSource.FromHwnd(new WindowInteropHelper(this).Handle);
if (enable)
source.RemoveHook(WndProc);
else
source.AddHook(WndProc);
}
private static IntPtr WndProc(IntPtr hwnd, int msg, IntPtr wParam, IntPtr lParam, ref bool handled)
{
const int WM_SYSCOMMAND = 0x0112;
const int SC_MOVE = 0xF010;
switch (msg)
{
case WM_SYSCOMMAND:
int command = wParam.ToInt32() & 0xfff0;
if (command == SC_MOVE)
handled = true;
break;
}
return IntPtr.Zero;
}
Now that works perfectly, but I'm really struggling to get this to work with a drop shadow on the window. When I add a 10px border to the window and set the dropshadow on this, I get the resizing icon in my border and not in my window:
https://imgur.com/a/S9oLK
I also had to modify the StateChanged event method to hide the border when maximised:
private void MainWindow_OnStateChanged(object sender, EventArgs e)
{
if (WindowState == WindowState.Maximized && !isMaximized)
{
// max
WindowState = WindowState.Normal;
isMaximized = true;
normalBounds = RestoreBounds;
Height = SystemParameters.WorkArea.Height;
MaxHeight = Height;
MinHeight = Height;
Top = 0;
Left = 0;
Width = SystemParameters.WorkArea.Width;
SetMovable(false);
this.grid.Margin = new Thickness(0);
this.BorderThickness = new Thickness(0);
}
else if (WindowState == WindowState.Maximized && isMaximized)
{
// min
WindowState = WindowState.Normal;
isMaximized = false;
MaxHeight = Double.PositiveInfinity;
MinHeight = 0;
Top = normalBounds.Top;
Left = normalBounds.Left;
Width = normalBounds.Width;
Height = normalBounds.Height;
SetMovable(true);
this.grid.Margin = new Thickness(10);
this.BorderThickness = new Thickness(10);
}
}
But this obviously doesn't work when the window is snapped to the edge of a screen: https://i.imgur.com/pGC1fio.png
To summarise, my issues are:
Resize grabber is in border not main window.
I don't know how to hide the border when the window is snapped to the edge of the screen.
Is there a simple way to fix this? I feel like I'm having to create a very hacky fix for all of this and thought it would be a lot easier to implement a custom window like this.
Thanks in advance for any help.
I have a method which draws lines in a canvas like this:
public void drawoncanvas(double[] coord, string fullkey)
{
myLine = new Line();
myLine.X1 = coord[0];
myLine.X2 = coord[2];
myLine.Y1 = coord[1];
myLine.Y2 = coord[3];
MainWindow.mycanvas.Children.Add(myLine);
myLine.MouseEnter += mymouse; //add MousEnter Event
myLine.MouseLeave += mymouseleave; //add MouseLeave Event
}
The MouseEnter Event then adds a DropShadowEffect to the line that triggers the event:
public void mymouse(object sender, MouseEventArgs e)
{
Line thisline = sender as Line;
thisline.Effect = new DropShadowEffect{Color = new Color { A = 255, R = 255, G = 255, B = 0 }, Direction = 320,ShadowDepth = 0, Opacity = 1};
}
This works fine. But now I want to remove this effect as soon as the mouse cursor is not anymore over the line:
public void mymouseleave(object sender, MouseEventArgs e)
{
Line thisline = sender as Line;
thisline.Effect = null; //this doesn't do anything
}
I know this is a is probably a really simple question but I couldn't find any solution so far.
EDIT:
Ok I found what causes the problem, still don't know a solution though: I don't only create the dropshadow in the MouseEnter event but also display a tootltip, so my full Code is actually:
public void drawoncanvas(double[] coord, string fullkey)
{
myLine = new Line();
myLine.Stroke = Brushes.Red;
myLine.X1 = coord[0];
myLine.X2 = coord[2];
myLine.Y1 = coord[1];
myLine.Y2 = coord[3];
myLine.Tag = fullkey;
MainWindow.mycanvas.Children.Add(myLine);
myLine.MouseEnter += mymouse;
myLine.MouseLeave += mymouseleave;
}
ToolTip tt = new ToolTip();
public void mymouse(object sender, MouseEventArgs e)
{
Line thisline = sender as Line;
string data = Convert.ToString(thisline.Tag);
string[] splitdata = data.Split('/');
tt.Content = String.Concat(splitdata[0], " -> ", splitdata[3] ,"kt -> ", splitdata[1]);
tt.StaysOpen = false;
tt.IsOpen = true; //the removing of the shadow on MouseLeave works when I comment this line out
thisline.Effect = new DropShadowEffect{Color = new Color { A = 255, R = 255, G = 255, B = 0 }, Direction = 320,ShadowDepth = 0, Opacity = 1};
}
public void mymouseleave(object sender, MouseEventArgs e)
{
Line thisline = sender as Line;
tt.IsOpen = false;
thisline.Effect = null;
}
If I simply comment out the tt.IsOpen = true; and do not display the tooltip it all works fine.....I'm really confused.
EDIT 2:
Here the XAML:
<Window x:Class="mapO1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:mapO1"
Title="mapO1" Height="600" Width="750" WindowStartupLocation="CenterScreen" SizeChanged="MainWindow_SizeChanged">
<Grid>
<Grid x:Name="mygrid">
<local:ZoomBorder x:Name="border" ClipToBounds="True" Background="Black">
<Grid Name="maingrid">
<Image Name="image1" />
<Canvas Name="mycanvas" HorizontalAlignment="Left" VerticalAlignment="Top" ClipToBounds="False"/>
</Grid>
</local:ZoomBorder>
<Button x:Name="button1" Content="Fullscreen on/off" HorizontalAlignment="Right" Height="18" Margin="0,20,50,0" VerticalAlignment="Top" Opacity="0.5" Width="108" FontWeight="Bold" Click="button1_Click"/>
<ComboBox x:Name="comboBox1" Height="24" HorizontalAlignment="Left" VerticalAlignment="Top" Width="150" Margin="10,20,0,0" Opacity="0.5" FontWeight="Bold" Text="Select Period" SelectionChanged="comboBox1_SelectionChanged"/>
<ComboBox x:Name="comboBox2" Height="24" HorizontalAlignment="Left" VerticalAlignment="Top" Width="150" Margin="10,60,0,0" FontWeight="Bold" Opacity="0.5" Text="Select Stream" DropDownClosed="comboBox2_DropDownClosed"/>
</Grid>
</Grid>
</Window>
I really want to create my own map control in WPF because the only one that would be suitable for my requirements would be the Google Maps JavaScript API because it can do almost anything I need but that is only for web and mobile and I have tried the Bing and ESRI maps but they can't do what I want.
I have started a little experiment project to see if I can load the tiles when zooming and it kind of works, here is the code:
<ScrollViewer Margin="10" PanningMode="Both" HorizontalScrollBarVisibility="Visible">
<Canvas x:Name="lyrTiles" Height="3000" Width="3000"/>
</ScrollViewer>
<Grid x:Name="lyrControl" Margin="10">
<Button x:Name="moveUp" Content="U" HorizontalAlignment="Left" Margin="35,10,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
<Button x:Name="moveRight" Content="R" HorizontalAlignment="Left" Margin="55,30,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
<Button x:Name="moveDown" Content="D" HorizontalAlignment="Left" Margin="35,50,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
<Button x:Name="moveLeft" Content="L" HorizontalAlignment="Left" Margin="15,30,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
<Button x:Name="zoomIn" Content="ZI" HorizontalAlignment="Left" Margin="35,81,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
<Button x:Name="zoomOut" Content="ZO" HorizontalAlignment="Left" Margin="35,311,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
<Slider x:Name="zoomSlider" HorizontalAlignment="Left" Margin="35,106,0,0" VerticalAlignment="Top" Orientation="Vertical" Height="200" Width="20" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" Interval="1"/>
<Button x:Name="typeHybrid" Content="Hybrid" HorizontalAlignment="Right" Margin="0,10,65,0" VerticalAlignment="Top" Width="50" Height="15" Padding="0,-1,0,0" FontSize="10"/>
<Button x:Name="typeTerrain" Content="Terrain" HorizontalAlignment="Right" Margin="0,10,10,0" VerticalAlignment="Top" Width="50" Height="15" Padding="0,-1,0,0" FontSize="10"/>
<Button x:Name="typeSatellite" Content="Satellite" HorizontalAlignment="Right" Margin="0,10,120,0" VerticalAlignment="Top" Width="50" Height="15" Padding="0,-1,0,0" FontSize="10"/>
<Button x:Name="typeRoad" Content="Road" HorizontalAlignment="Right" Margin="0,10,175,0" VerticalAlignment="Top" Width="50" Height="15" Padding="0,-1,0,0" FontSize="10"/>
<Label x:Name="copyright" Content="Map data ©2014 Google" HorizontalAlignment="Right" VerticalAlignment="Bottom" Padding="0" Width="200" FontSize="10" FontFamily="Calibri" FontWeight="Bold"/>
</Grid>
<Canvas x:Name="lyrActive" Margin="10,10,27,28" MouseWheel="lyrActive_MouseWheel" Background="#00000000"/>
public int zoomLevel = 0;
public int zoomWidth = 2;
public MainWindow()
{
InitializeComponent();
Image i = new Image(); i.Width = 250; i.Height = 250; i.Margin = new Thickness(0, 0, 0, 0);
i.Source = new BitmapImage(new Uri("https://a.tiles.mapbox.com/v3/examples.map-9ijuk24y/0/0/0.png"));
lyrTiles.Children.Add(i);
}
private void lyrActive_MouseWheel(object sender, MouseWheelEventArgs e)
{
if (e.Delta > 0)
{
lyrTiles.Children.Clear();
zoomLevel += 1; zoomWidth = zoomWidth + zoomWidth / 2;
for (int x = 0; x < zoomWidth; x++)
{
for (int y = 0; y < zoomWidth; y++)
{
lyrTiles.Children.Add(new Image()
{
Margin = new Thickness(250 * x, 250 * y, 0, 0),
Source = new BitmapImage(new Uri("https://a.tiles.mapbox.com/v3/examples.map-9ijuk24y/" + zoomLevel + "/" + x + "/" + y + ".png"))
});
}
}
}
}
private void ScrollViewer_MouseWheel(object sender, MouseWheelEventArgs e)
{
if (e.Delta > 0)
{
lyrTiles.Children.Clear();
zoomLevel += 1; zoomWidth = zoomWidth + zoomWidth / 2;
for (int x = 0; x < zoomWidth; x++)
{
for (int y = 0; y < zoomWidth; y++)
{
lyrTiles.Children.Add(new Image()
{
Margin = new Thickness(250 * x, 250 * y, 0, 0),
Source = new BitmapImage(new Uri("https://a.tiles.mapbox.com/v3/examples.map-9ijuk24y/" + zoomLevel + "/" + x + "/" + y + ".png"))
});
}
}
}
}
Is this the correct way I should be rendering the tiles? I know I have to remove ones that are not visible but this is just a very very simple project to see what I can actually do to make a map. How can I start to make this work better?
Also, I think that the biggest and most important thing will be the coordinates because they are used from everything from locating the centre of the map so it can download the correct tiles to placing markers at specific locations. How can I do this, do I need some sort of huge latitude and longitude axis?
Here's a number of projects that might save you some work:
OpenSource:
http://www.codeproject.com/Articles/238551/WPF-Map-App-WPF-meets-Google-Geocoding-Static-Maps
http://xamlmapcontrol.codeplex.com/
http://greatmaps.codeplex.com/
http://wpfsharpmapcontrols.codeplex.com/
Commercial:
http://thinkgeo.com/map-suite-developer-gis/wpf-edition/
http://resources.arcgis.com/en/help/runtime-wpf/concepts/index.html#//017000000031000000
https://www.carmenta.com/en/products/carmenta-engine/overview
http://www.componentsource.com/products/componentart-maps-for-wpf/index-gbp.html
If you don't mind using Bing:
http://msdn.microsoft.com/en-us/library/hh750210.aspx
http://visualstudiomagazine.com/Articles/2012/04/01/Map-Your-Apps.aspx?Page=1
I have a Grid which scaled/zoomed with ScaleTransform by slider. At runtime many UIElements are added to this Grid.
I want to show some tooltips, but not scaled! How should I do that?
For the example: Grid has scaleX and scaleY 2, so I set new ScaleTransform(0.5, 0.5), but didn't help. It seems that the most similar value is 0.740.. Why?
Even Grid's LayoutTransform.Inverse is set to scale values 0.5.
XAML:
<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" Height="Auto" Width="Auto" Name="graphScrollViewer" ScrollChanged="graphScrollViewer_ScrollChanged">
<Grid Margin="0,0,0,0" Name="graphGrid" Width="Auto" Height="Auto" ScrollViewer.IsDeferredScrollingEnabled="True" MouseLeftButtonDown="graphGrid_MouseLeftButtonDown" MouseLeftButtonUp="graphGrid_MouseLeftButtonUp" MouseMove="graphGrid_MouseMove">
<Grid.LayoutTransform>
<ScaleTransform ScaleX="{Binding ElementName=sldZoom, Path=Value}" ScaleY="{Binding ElementName=sldZoom, Path=Value}" />
</Grid.LayoutTransform>
</Grid>
</ScrollViewer>
<Slider Minimum="0.1" Maximum="20" Value="1" x:Name="sldZoom" Panel.ZIndex="10" Orientation="Horizontal" VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="0,0,20,20" Height="23" Width="100" ValueChanged="sldZoom_ValueChanged"/>
Code-behind:
(method of Rectangle (MouseEnter event) dynamically added to grid)
private void rect_MouseEnter(object sender, MouseEventArgs e)
{
RectToolTip = new TextBlock();
RectToolTip.HorizontalAlignment = HorizontalAlignment.Left;
RectToolTip.VerticalAlignment = VerticalAlignment.Top;
RectToolTip.TextAlignment = TextAlignment.Center;
RectToolTip.Height = this.HeaderTwoHeight + 1;
RectToolTip.Text = " " + (RectsTasks[(sender as Rectangle)]).Info + " ";
RectToolTip.Background = this.ToolTipBackground;
RectToolTip.Foreground = this.ToolTipFontColor;
RectToolTipBorder = new Border();
RectToolTipBorder.Child = RectToolTip;
RectToolTipBorder.BorderThickness = new Thickness(this.ToolTipBorderThickness);
RectToolTipBorder.BorderBrush = this.ToolTipBorderColor;
RectToolTipBorder.Margin = new Thickness(e.GetPosition((graphGrid)).X + 10, e.GetPosition((graphGrid)).Y + 10, 0, 0);
RectToolTipBorder.VerticalAlignment = System.Windows.VerticalAlignment.Top;
RectToolTipBorder.HorizontalAlignment = System.Windows.HorizontalAlignment.Left;
graphGrid.Children.Add(RectToolTipBorder);
RectToolTipBorder.LayoutTransform = RectToolTip.LayoutTransform = new ScaleTransform(????);
Grid.SetZIndex(RectToolTip, 20);
Grid.SetZIndex(RectToolTipBorder, 20);
}
You need to assign the inverse transform to the child element, so that the child will stay intact.
RectToolTipBorder.LayoutTransform = graphGrid.LayoutTransform.Inverse as Transform;