How to find the position of an Image in WPF C#? - c#

I have an array which stores many images within in. I am trying to figure out how to get the position of the image (x,y) within the window. I aim to put it in a timer so I can get the updated location as the program runs.
The images are added with the following code:
arrayName[p] = new Image();
arrayName[p].Source = new BitmapImage(new Uri(#"imgPlaneSprite.png", UriKind.Relative));
arrayName[p].Width = 50;
arrayName[p].Height = 50;
arrayName[p].Stretch = Stretch.Fill;
LayoutRoot.Children.Add(arrayName[p]);

try this:
arrayName[p].PointToScreen(new Point(0, 0));

Related

Emoticons in TextBlock in WPF application

I want to add emoticons to WPF chat application. I know that wpf don't supports emoticons for that reason I am replacing emoticons with image. I am using inline property of textBlock to add images to textBlock but, I having problem with alignment of images. I am not able to make emoticon images to get properly aligned. I am sharing a screenshot of how it is looking.
Screenshot of app window
This is how emoticon is looking
the example is just a demo where I am adding elements in constructor only to see how it will look. I am sharing my code as well.
#out.Inlines.Add(new Run("Hii, my name is Ajay!!"));
Image emo = new Image();
emo.Height = 15;
emo.Width = 15;
emo.VerticalAlignment = VerticalAlignment.Bottom;
emo.Margin = new Thickness(3, 0, 0, 0);
emo.Source = new BitmapImage(new Uri(#"C:\Users\admin\Desktop\test1.jpg", UriKind.RelativeOrAbsolute));
// InlineUIContainer container = new InlineUIContainer(emo);
#out.Inlines.Add(emo);
Is there any way I can make emoticon image properly align? Is it OK to use textblock or I should use any other control for this?
Any help is highly appreciated.
A few potential options may be:
set the Top margin on the Image. it's in the format of LEFT, TOP, RIGHT, BOTTOM
emo.Margin = new Thickness(3, 4, 0, 0);
Another option is to wrap the image in a Run and set the BaselineAlignment. https://msdn.microsoft.com/en-us/library/system.windows.baselinealignment
var imageRun= new Run(emo);
imageRun.BaselineAlignment = BaselineAlignment.TextBottom; //experiment with the other enum options
#out.Inlines.Add(imageRun);
adjust the text rather than the image (though i would keep trying with the image and use this as a last resort).
var textRun = new Run("Hii, my name is Ajay!!");
textRun.Margin = experiment;
textRun.BaselineAlignment = experiment;
#out.Inlines.Add(textRun );
I tried as #Bill Tarbell suggested and it worked for me.
Final working code is as follows:
var textRun = new Run("Hii, my name is Ajay!!");
textRun.BaselineAlignment = BaselineAlignment.Center;
#out.Inlines.Add(textRun);
Image emo = new Image();
emo.Height = 20;
emo.Width = 20;
emo.VerticalAlignment = VerticalAlignment.Bottom;
emo.Margin = new Thickness(3, 0, 0, 0);
emo.Source = new BitmapImage(new Uri(#"C:\Users\admin\Desktop\test1.jpg", UriKind.RelativeOrAbsolute));
// InlineUIContainer container = new InlineUIContainer(emo);
#out.Inlines.Add(emo)

How to add marker at current location on a Windows Phone App Map

First of all I'm very new to Windows Phone dev so I might miss something obvious.
I have a ControlMap in my xaml, i'm trying to add marker at my current location. I've gone through many tutorials and I can't only find deprecated ways (tons of using not working) to do it and while it seems simple at first view, I simply can't make it work.
The map in the xaml :
<Maps:MapControl x:Name="LocateMap" Height="221" Margin="0,0,-0.167,0"/>
What should I do in the .cs to add this marker ? And where ?
The intent is to store it later, and then print when the app launch all the olds markers + the actual location marker.
If you want to set a pin on a specific location (latitude, longitude), do the following steps.
//setting the Map center
LocateMap.Center = CurrentLocation = new System.Device.Location.GeoCoordinate(lat, lon);
// Create a small circle to mark the current location.
Ellipse myCircle = new Ellipse();
myCircle.Fill = App.Current.Resources["PhoneAccentBrush"] as SolidColorBrush;
myCircle.Height = 20;
myCircle.Width = 20;
myCircle.Opacity = 50;
// Create a MapOverlay to contain the circle.
MapOverlay myLocationOverlay = new MapOverlay();
myLocationOverlay.Content = myCircle;
myLocationOverlay.PositionOrigin = new Point(0.5, 0.5);
myLocationOverlay.GeoCoordinate = new System.Device.Location.GeoCoordinate(lat,
lon);
// Create a MapLayer to contain the MapOverlay.
MapLayer myLocationLayer = new MapLayer();
myLocationLayer.Add(myLocationOverlay);
//adding map layer to the map
LocateMap.Layers.Add(myLocationLayer);

Animation AutoReverse = false but does it anyway and starts from the wrong starting point

I'm trying to get an image from the bottom right corner of a canvas to the top left corner of the canvas an repeating this behavior forever. The image should never do the reverse animation from the top left corner to the top right corner. I am new with animation, so I used this example.
At the moment my image is moving from the top left corner to the right bottom corner and back. I tried changing the start position of the image in the canvas, with the result, that the animation used this position as new starting point. I also tried using negative values, to get the image moving to the opposite direction. Reducing the amount of points in the segment got me a shorter animation path, but nothing else. I also set AutoReverse=false, without any changes in the animation behavior.
My ideas are,
- The segment class is building a circle out of the points, but which other class to use?
- The start position has to change, but how do I get the object to move up instead of down the screen?
My Code,
Storyboard animationSB = new Storyboard();
//Image book = createImage(model.keywordCollection[0].cover.small);
Image rope1 = createImage("pack://application:,,,/GUI;component/Resources/rope_trans.png");
rope1.Height = 360.0;
rope1.Width = 185.0;
//Transform to move the book image
TranslateTransform aniRope1 = new TranslateTransform();
this.RegisterName("AnimatedRope1", aniRope1);
rope1.RenderTransform = aniRope1;
Canvas.SetLeft(rope1, 258.659);
Canvas.SetTop(rope1, 583.212);
LeftRope.Children.Add(rope1);
//Anitmation path
PathGeometry animationPath1 = new PathGeometry();
PathFigure pathFigure1 = new PathFigure();
PolyLineSegment lineSegments1 = new PolyLineSegment();
lineSegments1.Points.Add(new Point(LeftRope.ActualWidth, LeftRope.ActualHeight));
lineSegments1.Points.Add(new Point(258.659, 583.212));
lineSegments1.Points.Add(new Point(120.596, 272.665));
lineSegments1.Points.Add(new Point(0, 0));
pathFigure1.Segments.Add(lineSegments1);
animationPath1.Figures.Add(pathFigure1);
animationPath1.Freeze();
//Animate transform to move image along the path on the x-axis
DoubleAnimationUsingPath translateXAnimation1 = new DoubleAnimationUsingPath();
translateXAnimation1.PathGeometry = animationPath1;
translateXAnimation1.Duration = TimeSpan.FromSeconds(6);
translateXAnimation1.Source = PathAnimationSource.X;
translateXAnimation1.AutoReverse = false;
Storyboard.SetTargetName(translateXAnimation1, "AnimatedRope1");
Storyboard.SetTargetProperty(translateXAnimation1, new PropertyPath(TranslateTransform.XProperty));
//Animate transform to move image along the path on the y-axis
DoubleAnimationUsingPath translateYAnimation1 = new DoubleAnimationUsingPath();
translateYAnimation1.PathGeometry = animationPath1;
translateYAnimation1.Duration = TimeSpan.FromSeconds(6);
translateYAnimation1.Source = PathAnimationSource.Y;
translateYAnimation1.AutoReverse = false;
Storyboard.SetTargetName(translateYAnimation1, "AnimatedRope1");
Storyboard.SetTargetProperty(translateYAnimation1, new PropertyPath(TranslateTransform.YProperty));
//Create Storyboard containing and applying the animation
//animationSB.RepeatBehavior = RepeatBehavior.Forever;
animationSB.Children.Add(translateXAnimation1);
animationSB.Children.Add(translateYAnimation1);
animationSB.AutoReverse = false;
The storyboard is started in another method.
I am developing on windows 8.1N with .Net 4.5.1 C# an desktop application.
You should replace the line:
lineSegments1.Points.Add(new Point(LeftRope.ActualWidth, LeftRope.ActualHeight));
with
pathFigure1.StartPoint = new Point(LeftRope.ActualWidth, LeftRope.ActualHeight);
It turns out that if you don't specify the StartPoint for PathFigure, it automatically closes the figure, i.e. connects last and first points from the points collection.

How do I find a certain Child image in a Canvas?

I have a Canvas that has 400 children. Each of the children is a rectangle and is filled with an Image. If I want to find a certain image, how would I go doing about that?
//My code to fill a rectangle
Image img = new Image();
img.Source = new BitmapImage(new Uri(#"hero.png", UriKind.Relative));
img.Margin = rec.Margin;
ImageBrush imgbrush = new ImageBrush();
imgbrush.ImageSource = img.Source;
rec.Fill = imgbrush;
//My attempt at finding that certain rectangle
foreach (Rectangle rec in canvas1.Children)
{
if (rec.Fill = ImageBrush.ImageSourceProperty) // I tried to compare the rectangle with the image's source
{
}
}
You may use names for for every specific Image then using FindName Method
object wantedNode = stackPanel.FindName("dog");
Why not store the objects in an array (key/pair) that you can later iterate through?

Set image coordinates programmatically

Rather than declaring an image and setting the source from the xaml file, can someone do the initialization part, set the image coordinates, and set the source completely in the code?
// Create Image Element
Image myImage = new Image();
myImage.Width = 200;
// Create source
BitmapImage myBitmapImage = new BitmapImage();
// BitmapImage.UriSource must be in a BeginInit/EndInit block
myBitmapImage.BeginInit();
myBitmapImage.UriSource = new Uri(#"C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Water Lilies.jpg");
// To save significant application memory, set the DecodePixelWidth or
// DecodePixelHeight of the BitmapImage value of the image source to the desired
// height or width of the rendered image. If you don't do this, the application will
// cache the image as though it were rendered as its normal size rather then just
// the size that is displayed.
// Note: In order to preserve aspect ratio, set DecodePixelWidth
// or DecodePixelHeight but not both.
myBitmapImage.DecodePixelWidth = 200;
myBitmapImage.EndInit();
//set image source
myImage.Source = myBitmapImage;
You need to create a new Image specifying the source:
Image myImage = new Image();
BitmapImage bitmapImage = new BitmapImage(new Uri("/YourSource", UriKind.Relative)); //Or UriKind.Absolute depending in the path
myImage.Source = bitmapImage;
If you want to place the image into some coordenates you can place a Canvas behind and place the image using Canvas coordenates. Use:
_myCanvas.Children.Add(myImage); //To add your image to Canvas, declared on Xaml or previously created and added to your control
Canvas.SetTop(myImage, 100); //Set Y coordenate relative to Canvas initial point
Canvas.SetLeft(myImage, 100); // Set X

Categories

Resources