wrong bitmap after scale with renderOptions - wpf

In dialog, I need to scale bitmap in cell of datagrid for avoid bluring
here is MyFile.xaml
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Image Margin="1"
Width="90"
Height="18"
VerticalAlignment="Center"
Stretch="Fill"
RenderOptions.BitmapScalingMode="NearestNeighbor"
RenderOptions.EdgeMode="Aliased"
SnapsToDevicePixels="True"
HorizontalAlignment="Center">
<Image.Source>
<MultiBinding Converter="{StaticResource HatchIdToPaleteImageConverter}" ConverterParameter="90">
<Binding Path="HatchId"/>
<Binding Path="Color" />
</MultiBinding>
</Image.Source>
</Image>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
But bitmaps in 5th, 20th row are hidden their top but the others are OK.
If I scroll my grid by vertical scrollbar, the hidden image changed: bitmaps in 11st, 26th row are hidden their top but the others are OK. I guess the 5th, 20th datagridcell of view is always wrong.
If I remove RenderOptions.BitmapScalingMode="NearestNeighbor"
the bitmap in all rows are showed full but it's blur.
I try to remove the margin or resize my row's height but it's not work.

I change height of Image. It's work.
Maybe the height of bitmap is not the same between all row of datagrid
Height="19"

Related

ActualHeight Grows But Doesn't Shrink

I'm experiencing an odd behavior with WPF.
My goal here is to have an ItemsControl with a vertical line on each item's side going from the top to the bottom of the item. Being that the items may vary in height, I'm binding the Line's Y2 property to the ActualHeight of the StackPanel belonging to the Grid.
Here's the XAML:
<ItemsControl Grid.Row="1" BorderThickness="0" ItemsSource="{Binding ShipmentActivity}" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid Name="ListBox">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Line Stroke="{StaticResource ButtonOutlineBrush}" X1="8" X2="8" Y1="0"
Y2="{Binding ActualHeight, ElementName=ShipmentActivity}"
StrokeThickness="1" />
<StackPanel Grid.Column="1" Margin=".1" x:Name="ShipmentActivity">
<StackPanel.Resources>
<Style TargetType="TextBlock">
<Setter Property="TextWrapping" Value="Wrap"/>
</Style>
</StackPanel.Resources>
<TextBlock Text="{Binding Status}" FontWeight="SemiBold" FontSize="13" />
<TextBlock Text="{Binding Location}" Foreground="Gray"/>
<TextBlock Text="Wed, Sep 13, 2017, 8:29 PM (2 days ago)" Foreground="Gray"/>
</StackPanel>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
Running this at first seems perfect. The problem is noticeable once I start to narrow the width of the window, causing the TextBlocks to wrap, and in effect
causing the items to grow in height, and then resizing the window back to its original width (and beyond). Although the TextBlocks are back to its original state (and height), the height of the items remain the same - stuck at its highest point, leaving huge gaps below the text, while the Line's height doesn't shrink. The Line is definitely the one to blame here, because removing the line removes the issue.
What is even stranger yet, is adding a margin to the StackPanel even the slightest (.1) fixes the issue, and the items shrink back to its intended height.
Am I doing something wrong, or is this a bug?
I would use a Border element to decorate the StackPanel, rather than using a Line. Then just set the BorderThickness property of the Border accordingly.
Hence your XAML would be like this:
<ItemsControl ...>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border BorderThickness="1,0,0,0"
BorderBrush="{StaticResource ButtonOutlineBrush}">
<StackPanel ...>
You can use the Padding property of the Border and/or the Margin property of the StackPanel to space-out the two elements.

Silverlight - add tooltip to a rotated textblock

I have a TextBlock which is rotated at 90 degrees in the Silverlight XAML:
<TextBlock Name="txbPW" Text="West">
<TextBlock.RenderTransform>
<RotateTransformAngle="90" />
</TextBlock.RenderTransform>
</TextBlock>
I want to add a tooltip (not rotated) to it. Any help?
What's your problem? Do you want to show the tooltip rotated too?? Or don't?? Or are you just asking to add a tooltip to a textblock???
If you only want to add a tooltip to a textblock you have to do something like this:
<TextBlock Name="txbPW" Text="West">
<TextBlock.RenderTransform>
<RotateTransformAngle="90" />
</TextBlock.RenderTransform>
<ToolTipService.ToolTip>
<ToolTip Content="ToolTip"></ToolTip>
</ToolTipService.ToolTip>
</TextBlock>
http://bouncetadiss.blogspot.com.es/2010/02/tooltip-for-textblock-in-silverlight.html

Canvas height & width bind to xml

In the past I created a winform user control that inherit imagebox control, which the user can select part of the image by drawing a rectangle with the mouse.
Now I want to do the same with WPF. I wrote this XAML code:
<StackPanel Width="321" Height="241">
<Canvas x:Name="SampleImageCanvas"
MouseMove="SampleImageCanvas_MouseMove"
MouseDown="SampleImageCanvas_MouseDown"
MaxHeight="240" MaxWidth="320" >
<Canvas.Width>
<MultiBinding Converter="{StaticResource SizeConverter}" Mode="OneWay">
<Binding XPath="./Size/Width" />
<Binding XPath="./Size/Ratio" />
</MultiBinding>
</Canvas.Width>
<Canvas.Height>
<MultiBinding Converter="{StaticResource SizeConverter}" Mode="OneWay">
<Binding XPath="./Size/Height" />
<Binding XPath="./Size/Ratio" />
</MultiBinding>
</Canvas.Height>
<Canvas.Background>
<ImageBrush x:Name="SampleImage" ImageSource="{Binding XPath=./SampleImage}" Stretch="Uniform"/>
</Canvas.Background>
<Rectangle x:Name="ROI"
Canvas.Top="{Binding XPath=./ROI/Top, Mode=TwoWay}"
Width="{Binding XPath=./ROI/Width, Mode=TwoWay}"
Height="{Binding XPath=./ROI/Height, Mode=TwoWay}"
Canvas.Left="{Binding XPath=./ROI/Left, Mode=TwoWay}"
Stroke="#FFD13750"
/>
</Canvas>
</StackPanel>
The data is stored in an xml document. the image is bigger than the canvas, so it has to be stretch uniformly, to fit the max size of the canvas, and I want the canvas to resize to the size of the image scaled display, so the image fills 100% of the canvas with no margins.
when I'll have this, the mouse move/enter/exit event will be set only to the image borders.
The problem is the canvas height binded value, which cause the image not to be shown although it has beec defined same as the canvas width which works, and the convertor returns the corect value.
When I set the height to exact value instead of binded value, like Height="240", it works.
Thanks!

Image renders differently depending on position

I have an ItemsControl presenting a list of buttons. Each button has an image as it's content (png), but the image looks slightly different for each row.
The below image is magnified version of what I'm seeing:
Here is the xaml:
<ItemsControl ItemsSource="{Binding Items}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Name="tb1">hello</TextBlock>
<Button Height="{Binding ElementName=tb1, Path=ActualHeight}" Padding="0,-3,-3,-3" BorderBrush="Transparent" Background="Transparent" >
<Image Stretch="Fill" Source="stock_standard_filter.png" Margin="0">
</Image>
</Button>
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
I've had a similar issue previously and was able to solve it using SnapsToDevicePixels="True", but that solution is not working this time. I've also tried UseLayoutRounding="True" and RenderOptions.EdgeMode="Aliased"
The height of the button is bound so the image will be stretched to fill the button. Because WPF uses doubles (1/96 inch units) there is bound to be some rounding off. SnapsToDevicePixels and Layout rounding might help when you use them on the StackPanel but as long as you stretch the image it will get blurred.
My best guess is to set "Stretch to None" and experiment with SnapsToDevicePixels and Layout rounding.

WPF TextBox Height Equals Parent Height minus 50 pixels?

I'm successfully getting a TextBox to resize with a parent Border height but I need the TextBox to actually be 50 pixels smaller in height than the parent Border.
Any ideas how to achieve this?
The code I'm using is
<Border VerticalAlignment="Stretch" HorizontalAlignment="Stretch" >
<TextBox x:Name="txtActivityNotes" HorizontalAlignment="Stretch" Height="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Border}}, Path=ActualHeight}" AcceptsReturn="True" VerticalContentAlignment="Top" TextWrapping="WrapWithOverflow" VerticalScrollBarVisibility="Auto" />
</Border>
Can't you just set a bottom margin of 50?
<TextBox Margin="0,0,0,50" />
I've tried following and it works.
add following to text box in xaml:
------
VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"
Height="{Binding RelativeSource={RelativeSource FindAncestor, *AncestorType*={x:Type *Grid*}}, Path=ActualHeight}"
------
Here, AncestorType is type of container containing the textBox. In my case it was 'Grid'.
And also add margin like,
Margin="0,0,0,50"
to keep distance from border below.
============
oops sorry i posted on the same page.!
how about using a converter on the binding to minus 50 off the height
heres an example of using a converter

Resources