0

I have a simulator Diagram. I want to place the label above the simulator. I have used canvas for aligning the label, but when I resizing the window the label alignment is changed. My code is like this, Please give any suggestion to place the label on the grid image when normal and resizing the window.

<Grid>
   <Image Source="/Image/SimulatorDiagram.png"/>
   <Canvas>
       <Label 
          Canvas.Left="100"  
          Canvas.Top="35"
          Content="Monitor"
          Width="95"
          Height="43"/>
       <Label 
          Canvas.Left="150"  
          Canvas.Top="75"
          Content="100 % Circulation"
          Width="60"
          Height="73"/>
   </Canvas>
</Grid>

Please refer the screenshot for more clarification about my question. I have highlighted the label placement on the screenshot using red color box. Screenshot

Achu_L
  • 175
  • 1
  • 13
  • 2
    Put the Image into the Canvas, and the Canvas in a Viewbox. Set Stretch=None on the Image. Besides that, you may use the (simpler) TextBlock instead of Label. – Clemens Sep 17 '18 at 12:10
  • Do you want to image to stretch or does it have a fixed size? – mm8 Sep 17 '18 at 12:14
  • @mm8, When restoring or resizing the widow the image size will be change. – Achu_L Sep 17 '18 at 12:19
  • For placing elements at relative instead of absolute positions, you might want to use an approach like [this](https://stackoverflow.com/a/21158560/1136211), perhaps without the relative width/height part. – Clemens Sep 17 '18 at 12:21
  • @Clemens, As per your suggestion I put the image into the canvas, and the Canvas in a ViewBox. Its working fine. Thank you – Achu_L Sep 18 '18 at 04:55

0 Answers0