i use a rectangle lying over other controls to darken them. now, i still want to be able to interact with the controls behind the rectangle, this rectangle will never have another sense than his visual aspect. the problem is, that it catches all clicks & so on, so it's ATM a obstacle.
xaml
<Rectangle Canvas.ZIndex="1" Opacity="0" Name="shadow" Fill="Black"/>
c#
shadow.Opacity = Math.Round(1-(double)(App.Current as App).dimfactor / 255,2);
(App.Current as App).dimfactor is a value between 150 & 255.
how to deal with that?
thanks
I'm not entirely sure if it's the same in WP7 as silverlight but can't you set the IsHitTestVisible bool to false?
<Rectangle Canvas.ZIndex="1" IsHitTestVisible="false" Opacity="0" Name="shadow" Fill="Black"/>
Related
I'm trying to create a tile in WPF that looks like the tiles of the Windows 8 Start screen.
Actually, the problem is that I don't know how to make the tilt effect of the Windows 8 tiles ( the click effect ).
I tried different transformations such as matrix transofmration, but this is not what I want.
Explanation in image :
Default style:
Here is my code
<Grid >
<Grid.LayoutTransform>
<MatrixTransform>
<MatrixTransform.Matrix >
<Matrix OffsetX="5" OffsetY="5" M11="1" M12="0.1"></Matrix></MatrixTransform.Matrix>
</MatrixTransform>
</Grid.LayoutTransform>
<Grid.Background>
<ImageBrush ImageSource="/MaCollectivitéWPF;component/src/Img/Home/Porte Document-petite.jpg" Stretch="UniformToFill" >
</ImageBrush>
</Grid.Background>
It's almost what I want but I only want the bottom to be tilted.
I've take a look at the 3D controls but I think it's to complicated for what I'm looking for.
Is there a solution with Layout Transformation I would not have seen yet ?
I think you want to pinch Greg Schechter's Planerator for tilting.
Your use case is exactly the one in the article, so I doubt you'd need to change anything. I've not tried it myself, but it seems to reduce tilting the plane to fairly easy xaml. Worth a look at least.
<pl:Planerator RotationY="35">
<StackPanel Orientation="Horizontal" ... >
<StackPanel>
<Label FontSize="24" Content=" " Foreground="#FF000000"/>
<Border ... >
<MediaElement x:Name="myMediaElement" />
</Border>
</StackPanel>
<ListBox ... />
</StackPanel>
</pl:Planerator>
I'd like to create a neon(-like) effect in wpf/c#, to be used on a series of polylines.
The closest i come to this was using blur (not very close, but eh), but the it dims the colors too dark and I have no idea how to make even that glow. Is there an effect close to this, or I should try to write a shader for it somehow?
I'd like to do this for a school project and i'd rather not turn in a bunch of outside libraries for a small amount of self-written code. Also about google: most of the stuff i found were pretty much using blur/dropshadow to create these fading colors, not something that actually has this neon-y effect.
As others have already suggested you should use DropShadowEffect to achieve a neon-like effect:
<Canvas Height="120" Width="280" Background="Black">
<Polyline
Points="10,110 60,10 110,110 105,110 60,18 15,110 10,110"
Stroke="#BB0000"
Fill="#FF0000"
StrokeThickness="2" >
<Polyline.Effect>
<DropShadowEffect Color="#FF9999" ShadowDepth="0" Direction="0" BlurRadius="25" />
</Polyline.Effect>
</Polyline>
<Polyline
Points="10,105 110,105 110,10 115,10 115,110 10,110 10,105"
Stroke="#00BB00"
Fill="#00FF00"
StrokeThickness="2"
Canvas.Left="150">
<Polyline.Effect>
<DropShadowEffect Color="#99FF99" ShadowDepth="0" Direction="0" BlurRadius="25" />
</Polyline.Effect>
</Polyline>
</Canvas>
Unfortunately there is no built-in effect which is specifically designed to create neon effect, but by tweaking the colors you can create quite good (or at least acceptable) results (especially for a school project...):
I would like to user Rectangle to display two colors in VS 2010 window phone, if Rectangle can't, please tell how to do.
<Rectangle Height="20" Width="400" Stroke="White" Fill="Green" StrokeThickness="1">
maybe its possible through a gradient. but otherwise i would suggest to do two rectangles, so both just have the half of the height/width (depending on where you want do have the colors)
I've encountered a problem with bitmap images in WPF. When the image container starts on a position which is not a whole number, the image seems to not respect the value of SnapsToDevicePixels.
Example code:
<Window x:Class="BlurryImage.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Height="110" Width="200">
<StackPanel Orientation="Horizontal" VerticalAlignment="Center">
<Button SnapsToDevicePixels="True">
<Image SnapsToDevicePixels="True" Source="i16.png" Stretch="None"/>
</Button>
<Button SnapsToDevicePixels="True" Margin="10.333333,0,0,0">
<Image SnapsToDevicePixels="True" Source="i16.png" Stretch="None"/>
</Button>
</StackPanel>
</Window>
(Note the value of the left margin: 10.333333.)
Here the image i16.png is a simple 16x16 bitmap in 96 DPI resolution with thin vertical lines: . (My system resolution is 96 DPI, Windows XP, .NET 4)
When I run the program, the first image is sharp, whereas the second one is blurry:
Different sources, including some here on stackoverflow, suggest different workarounds. (For example, these posts: [1], [2] and [3].) I tried the workarounds, and them seem to work. Using UseLayoutRounding="true" on the main window makes both images sharp. Using RenderOptions.BitmapScalingMode="NearestNeighbor" on the image makes it sharp, too.
The question is, why doesn't SnapsToDevicePixels="True" work without workarounds? Is it a bug in WPF or I am using it in a wrong way?
From this blog entry:
SnapsToDevicePixels
WPF anticipated that there would be cases where people wanted to align
with the pixel grid instead of using sub-pixel precision. You can set
the SnapsToDevicePixels property on any UIElement. This will cause us
to try and render to the pixel grid, but there are quite a few cases
that don't work - including images. We will be looking to improve
this in the future.
So it's just a known limitation of what SnapsToDevicePixels can do.
I want to be able to have an Image object render just a portion an image, that I will control programatically. For example, this is what I have so far:
<Image Grid.Column="1" Grid.Row="1" Grid.RowSpan="3" Height="160"
HorizontalAlignment="Right" Name="avatarImage" Stretch="None"
VerticalAlignment="Center" Width="160"
Source="/Crystal%20Cloud;component/data/images/characters.png"
Margin="0,0,40,0" />
I want to only render one of the characters at a time, and use the button to change which one it renders. Can I do this, and if so, how?
You can definitely use the ImageBrush.Transform to extract the portion of the bitmap that you are interested in, and if you do not require very high frame rates that is the way to go.
However if you are going to need to optimize the frame rate then you can dynamically extract the individual bitmaps from the sprite sheet and cache those bitmaps and display them as required. The blog post below provides some code that you can use to extract the individual bitmaps, that you can then cache.
http://taylorza.blogspot.com/2009/08/silverlight-spritesheet-management-with.html
Remember the key to performance here is that you cache the bitmaps and do not go through all the trouble of extracting them each time you need a new image.
You also can place your image inside a Canvas and define a clip for it (visible portion). Then for animating the character you can programatically change the Top and Left of the image in time intervals:
<Canvas Width="200" Height="100">
<Canvas.Clip>
<RectangleGeometry Rect="0, 0, 200, 100"/>
</Canvas.Clip>
<Image x:Name="imgCharacter" Source="..." Canvas.Left="..." Canvas.Top="..." />
</Canvas>
imgCharacter.SetValue(Canvas.LeftProperty, currentFrame.Left);
imgCharacter.SetValue(Canvas.LeftProperty, currentFrame.Top);