WPF: CroppedBitmap as Source in XAML displays nothing - wpf

Not sure what the issue is here. If I do the following:
<Image Width="90" Height="97" Source="<some path>" />
My image shows up as expected. But I want to crop it so I use the following code with the exact same path.
<Image>
<Image.Source>
<CroppedBitmap Source="<same path>">
<CroppedBitmap.SourceRect>
<Int32Rect X="0" Y="0" Width="100" Height="100" />
</CroppedBitmap.SourceRect>
</CroppedBitmap>
</Image.Source>
</Image>
And nothing shows up. Can anyone tell me why it's not working? I'm using a PNG if that makes a difference.

I had a similar problem, with a gif. In Visual Studio 2012, the image does not show up in the design view, but when I actually run the application, the cropped image shows up just fine.

Related

RibbonSplitButton cannot locate resource

I have a RibbonSplitButton that contains a SmallImageSource like so:
<UserControl x:Class="myProgram/toolbars/MainToolbar">
<RibbonSplitButton SmallImageSource="/Images/Undo.png"/>
<!-- more buttons-->
</UserControl>
I try to use this in another file (main):
<UserControl x:Class="myProgram/main"
xmlns:toolbar="clr-namespace:myProgram.toolbars">
<toolbar:MainToolbar/>
</UserControl>
I get the error message in main:
Cannot locate resource 'images/undo.png'
However, when I switch to a normal button:
<Button>
<Image Style="{StaticResource buttonstyle}">
<Image.Source>
<BitmapImage DecodePixelWidth="40" UriSource="/Images/Undo.png"/>
</Image.Source>
</Image>
</Button>
the error is gone. I have tried using Pack URIs, changing the Build Action to Resource and Embedded Resource, as well as Clean Soultion, Rebuild Solution, Restarting Visual Studios (rinse and repeat). I image this has something to do with the RibbonSplitButton's image source, but I have no idea. The program runs fine (the Undo.png image shows and works perfectly), it's just annoying to have the error in my developer. Anyone have suggests on how to get rid of the error? (Note, this is a simplified folder structure, for example purposes).
EDIT
For anyone who ends up here at some point in the future, I found that this answer worked.

Image with Multiple Clickable Areas

I have an image that I want various parts of to be clickable. I found a comment in the question below mentioning this was possible with Expression Designer. I haven't been able to find a guide on how to do this. I understand that I have to export the image from Designer to Visual Studio. Is there a better way of achieving this or how do I go about creating the xaml for these clickable sections?
best way for clickable image map in wpf
Personally I'd use the second answer to that question i.e. do something like this:
<Canvas>
<Image Source="background.png"/>
<Ellipse Canvas.Left="82" Canvas.Top="88" Width="442" Height="216" Fill="Transparent" Cursor="Hand" MouseDown="Ellipse_MouseDown_1"/>
<Ellipse Canvas.Left="305" Canvas.Top="309" Width="100" Height="50" Fill="Transparent" Cursor="Hand" MouseDown="Ellipse_MouseDown_2"/>
</Canvas>
Then you can drag and resize the shapes in DevStudio using it's XAML editor's design mode.

Having difficulty using Z-Index in WPF

I've followed some examples trying to layer a rectangle over the WebBrowser object:
Here is the MSDN example link. (I got it to work)
Layers issue using Z-Index
Here is the code I'm trying to get to work:
<Grid>
<Canvas Margin="2,4,0,-450" >
<Rectangle Height="452" Canvas.ZIndex="1000" Name="rectangle1" Stroke="Black" Width="524" Opacity=".5" Fill="#8CBABABA" Canvas.Top="-7" Canvas.Left="-3" />
<WebBrowser Name="mapBrowser" Canvas.ZIndex="999" Margin="5,5,5,5" Height="452" Width="516" Canvas.Top="-11" />
</Canvas>
</Grid>
I'm trying to make the WebBrowser appear grayed out by making the rectangle appear over top of it. I'll also disable it.
Can anybody point to what I'm doing wrong?
I solved this issue by creating a .png image which I placed in the same space as the webbrowser. It looks like a grayed-out version of what first appears in the webbrowser. Then I conditionally hid the webbrowser which makes the image visible. This is the only way I've found to make it work using .Net 4.0.

Bizarre problem with WPF XAML file

I've just started a very simple WPF application which consists of a main large image and four smaller images.
In order to assist with the layout, I created some JPEGs in MsPaint containing the images -2, -1, 0, +1 and +2 and just copied them into the top level of the project directory.
The XAML segment contains, for the five images:
<Image Grid.Column="1" Grid.Row="2" Grid.ColumnSpan="4" Grid.RowSpan="1"
Margin="0,0,0,0" Name="imgPicture" Stretch="Fill" VerticalAlignment="Top"
Source="file:///C:/DAndS/Pax/MyDocs/VS2008/Projects/MyProj/zero.jpg" />
<Image Grid.Column="1" Grid.Row="4" Grid.ColumnSpan="1" Grid.RowSpan="1"
Margin="0,0,0,0" Name="imgPicMinus2" Stretch="Fill" VerticalAlignment="Top"
Source="file:///C:/DAndS/Pax/MyDocs/VS2008/Projects/MyProj/minus2.jpg" />
<Image Grid.Column="2" Grid.Row="4" Grid.ColumnSpan="1" Grid.RowSpan="1"
Margin="0,0,0,0" Name="imgPicMinus1" Stretch="Fill" VerticalAlignment="Top"
Source="file:///C:/DAndS/Pax/MyDocs/VS2008/Projects/MyProj/minus1.jpg" />
<Image Grid.Column="3" Grid.Row="4" Grid.ColumnSpan="1" Grid.RowSpan="1"
Margin="0,0,0,0" Name="imgPicPlus1" Stretch="Fill" VerticalAlignment="Top"
Source="file:///C:/DAndS/Pax/MyDocs/VS2008/Projects/MyProj/plus1.jpg" />
<Image Grid.Column="4" Grid.Row="4" Grid.ColumnSpan="1" Grid.RowSpan="1"
Margin="0,0,0,0" Name="imgPicPlus2" Stretch="Fill" VerticalAlignment="Top"
Source="file:///C:/DAndS/Pax/MyDocs/VS2008/Projects/MyProj/plus2.jpg" />
When I try to set the source property for the plus2 image, it complains with a dialog box stating:
Property value is not valid.
Details
|
V
The file plus2.jpg is not part of the project or
its 'Build Action' property is not set to 'Resource'.
Yet if I rename the file to plus3.jpg or plus2x.jpg, I don't have that problem.
Why is it complaining about plus2.jpg specifically?
Is it possible that you previously added then removed plus2.jpg?
Is it possible that you have not built the solution between the steps?
Clear src, build solution, set src to known working image, build solution, set src to non-working image.
Clear src of all images, build solution, set "Build Action" of all images to "None", build solution, set build-action to "Resource", build solution, set src of all images.
(Most Likely) Possible corrupted image, image with invalid color palette, image saved in invalid format.
See if you can load the image during run-time
Load image with Resouce Editor and "Save As".
The file extension does not make a difference, because the internal graphics format determines the image type. Meaning, if you created a jpg but saved it as bmp, the designer will still load the image correctly.
Try <Image.Source> <BitmapImage UriSource="sampleImages/bananas.jpg" /> </Image.Source>
I tried to duplicate the problem with no luck. I was able to use images that I "added existing" and images where I specified src="file:///c:..." Images inside the project, with and without the build-action set. Even images outside the project.
My other thought is there is something wrong with the image, but I did not add the comment. Yet, now that I think about it, the designer is going to try and load the image once you set src. If the image cannot be loaded then an exception will be thrown. Since you are in design-time, you get the invalid property prompt with an "obsure" details message.
What if you load the image during run-time to see what kind of exception is thrown, if any.
Don't really care about it. VS2008 when creating WPF applications has dozens of such warnings and most of them disappears after build. If app starts and is working - leave it alone. Personally I've installed around 10-15 hotfixes for various WPF related bugs in VS2008. VS2010 is much better.
Besides it's probably better to include image files in resources - you add them to the project (Add existing item) and then check whether the build action is set to Resource. (right click on that file in Solution Explorer and choose Properties)

WPF/XAML: Typography.Capitals seems to have no effect

All of these bits of text look the same, but I am trying to get them to look different. I want small caps text. What am I missing here to get the small caps typography effect to work?
To reproduce this, open Visual Studio 2008, Do File|New Project, create a new Windows|WPF application, paste the mark-up below into Window1.xaml, then run it.
<Window x:Class="WpfApplication1.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Grid>
<FlowDocumentReader>
<FlowDocument>
<Paragraph>
<Run>Some text</Run> <LineBreak />
<Run Typography.Capitals="SmallCaps">Some text</Run> <LineBreak />
<Run Typography.Capitals="AllSmallCaps">Some text</Run> <LineBreak />
<Run Typography.Capitals="PetiteCaps">Some text</Run> <LineBreak />
<Run Typography.Capitals="AllPetiteCaps">Some text</Run> <LineBreak />
</Paragraph>
</FlowDocument>
</FlowDocumentReader>
</Grid>
</Window>
Based on the first answer, it seems that if you specify a particular font, you can get somewhere. Change the FlowDocument start tag to:
<FlowDocument FontFamily="Palatino Linotype">
.. and you get SmallCaps and AllSmallCaps, but not PetiteCaps or AllPetiteCaps. So it depends on the font. But this gives rise to other questions:
Why doesn't the default font (which looks a lot like Times New Roman) support these?
Do other widely used fonts (e.g. the local Courier New equivalent) support these?
Is there a list of which fonts support what?
What percentage of fonts will support this - most, some, or few?
Can you determine in code what the font supports - if this is the case, I could fake the AllSmallCaps - e.g. by converting the text to all capitals and scaling by 80%. But not SmallCaps.
This only works with specific OpenType fonts - the example in Help uses Pescadero which is in the Open Type Sample. Even then, only SmallCaps and AllSmallCaps are supported.
I noticed that default font with a "bold" fontweight does render the SmallCaps properly:
<StackPanel>
<TextBlock Typography.Capitals="SmallCaps" FontFamily="Pescadero" Padding="2">2pm</TextBlock>
<TextBlock Typography.Capitals="SmallCaps" FontWeight="Bold" Padding="2">2pm</TextBlock>
</StackPanel>

Resources