I am building an application in WIndows phone 7. I have the following xaml:
<Rectangle Fill="White" HorizontalAlignment="Left" Height="123" Margin="273,173,0,0"
Stroke="Black" VerticalAlignment="Top" Width="172" RadiusX="20" RadiusY="20 />
Now here i want to insert a text and also make this clickable in order to navigate to a new page. How to do this. Please share some code
<Rectangle Fill="White" HorizontalAlignment="Left" Height="123" Margin="273,173,0,0"
Stroke="Black" VerticalAlignment="Top" Width="172" RadiusX="20" RadiusY="20"
MouseDown="SomeFunctionInCodeBehindToTakeYouToANewPage" />
<TextBlock HorizontalAlignment="Left" IsHitTestVisible="False" Margin="340,222,0,0"
VerticalAlignment="Top" Text="I Like Pie" />
Related
I'm creating an app who is a list of choices. For the 3 first choices I want to put 3 images an bellow them 3 radiobutton.
but it only show images when I write :
<Grid>
<Image x:Name="sinus" Source="C:\Users\Maximilien\Documents\BFH\HBridge\HBridge\Resources\sin1.bmp" HorizontalAlignment="Left" Height="100" Margin="120,80,0,0" VerticalAlignment="Top" Width="120" Stretch="Fill" />
<Image x:Name="triangle" Source="C:\Users\Maximilien\Documents\BFH\HBridge\HBridge\Resources\tri1.bmp" HorizontalAlignment="Left" Height="100" Margin="320,80,0,0" VerticalAlignment="Top" Width="120" Stretch="Fill" />
<Image x:Name="continue" Source="C:\Users\Maximilien\Documents\BFH\HBridge\HBridge\Resources\cont1.bmp" HorizontalAlignment="Left" Height="100" Margin="520,80,0,0" VerticalAlignment="Top" Width="120" Stretch="Fill" />
<RadioButton x:Name="sinus_checkbox" HorizontalAlignment="Left" Margin="173,200,0,0" VerticalAlignment="Top" Cursor="Hand" ToolTip="Tension Sinusoïdale" IsChecked="True"/>
<RadioButton x:Name="triangle_checkbox" HorizontalAlignment="Left" Margin="373,200,0,0" VerticalAlignment="Top" Cursor="Hand" ToolTip="Tension Triangulaire"/>
<RadioButton x:Name="continue_checkbox" HorizontalAlignment="Left" Margin="573,200,0,0" VerticalAlignment="Top" Cursor="Hand" ToolTip="Tension Continue"/>
but when I send the .exe to a friend the 3 images wouldn't display..
I've tried this :
<Grid>
<Image x:Name="sinus" Source="pack://siteoforigin:,,,/Resources/sin1.bmp" HorizontalAlignment="Left" Height="100" Margin="120,80,0,0" VerticalAlignment="Top" Width="120" Stretch="Fill" />
<Image x:Name="triangle" Source="pack://siteoforigin:,,,/Resources/tri1.bmp" HorizontalAlignment="Left" Height="100" Margin="320,80,0,0" VerticalAlignment="Top" Width="120" Stretch="Fill" />
<Image x:Name="continue" Source="pack://siteoforigin:,,,/Resources/cont1.bmp" HorizontalAlignment="Left" Height="100" Margin="520,80,0,0" VerticalAlignment="Top" Width="120" Stretch="Fill" />
<RadioButton x:Name="sinus_checkbox" HorizontalAlignment="Left" Margin="173,200,0,0" VerticalAlignment="Top" Cursor="Hand" ToolTip="Tension Sinusoïdale" IsChecked="True"/>
<RadioButton x:Name="triangle_checkbox" HorizontalAlignment="Left" Margin="373,200,0,0" VerticalAlignment="Top" Cursor="Hand" ToolTip="Tension Triangulaire"/>
<RadioButton x:Name="continue_checkbox" HorizontalAlignment="Left" Margin="573,200,0,0" VerticalAlignment="Top" Cursor="Hand" ToolTip="Tension Continue"/>
But with that , the 3 images won't even display on my PC and in the debug I got something like : Cannot find a part of the path 'C:\Users\Maximilien\Documents\BFH\HBridge\HBridge\bin\Debug\Resources\sin1.bmp'.
Maybe it's a problem with Ressources but I've set thoses images in the .resx
Thank for answer , I use VS2012 ultimate
Sorry for my english
P.S : some screen :
http://i.stack.imgur.com/8qM82.png
.rar of my project :
http://www.partage-facile.com/V0SQ3J1CU7/hbridge.rar.html
You can try using relative path (relative to your project folder) instead of absolute path like C:\... Assuming that your project folder is C:\Users\Maximilien\Documents\BFH\HBridge\HBridge, this is the relative path to your images :
<Image x:Name="sinus" Source="Resources\sin1.bmp" ..... />
<Image x:Name="triangle" Source="Resources\tri1.bmp" ..... />
<Image x:Name="continue" Source="Resources\cont1.bmp" ..... />
you can also rely on Visual Studio's intellisense to get the correct relative path. When typing Source="" in XAML, with cursor positioned between double-quotes press CTRL+SPACE, dropdown will appear suggesting available paths (tested in VS2012 here)
I want to create Curved TextBlock using XAML like:
I am doing it like this :
<TextBlock TextWrapping="Wrap" Text="TextBlock" FontSize="30" Height="46"
Width="182" RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Left"
VerticalAlignment="Top" Canvas.ZIndex="-1" Foreground="White"
Margin="486,125,0,0" UseLayoutRounding="False" d:LayoutRounding="Auto">
<TextBlock.Projection>
<PlaneProjection RotationZ="360" />
</TextBlock.Projection>
<TextBlock.RenderTransform>
<CompositeTransform Rotation="-30"/>
</TextBlock.RenderTransform>
</TextBlock>
But no success.
Can you tell me a better way?
Try to work on converting this to Windows 8:
http://www.codeproject.com/Articles/30090/Text-On-A-Path-in-WPF
Hi all,
I found an issue with textblock in my Silverlight application. As observed from the picture I attached, in the "How to play" silverlight page, the title are bound to disappear if I navigate from different route.
Please note that that is static textblock with static wording. Just that from different navigation point, the header wording is missing!
I navigate from screen to screen using this.content = new something; (e.g. : this.content = new instruction())
Can someone guide me on how to overcome this issue? All my page is not usercontrol, but just silverlight page.
<navigation:Page x:Class="SpotTheDifference.UI.Game.Silverlight.instruction"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
d:DesignWidth="893" d:DesignHeight="670"
Title="BonusLink Spot 'd' Difference">
<Grid x:Name="LayoutRoot">
<Image x:Name="imgBG" HorizontalAlignment="Left" Height="670" VerticalAlignment="Top" Width="893" Source="/img/bg/dialogbox-bg.jpg" Visibility="Visible"/>
<Image x:Name="imgPlayGame" HorizontalAlignment="Left" Height="50" Margin="731,209,0,0" VerticalAlignment="Top" Width="145" Source="/img/btn/btn_play_red.png"/>
<Button x:Name="btnPlay" Content="" HorizontalAlignment="Left" Margin="731,209,0,0" VerticalAlignment="Top" Width="145" Height="50" Opacity="0" Click="btnPlay_Click" MouseEnter="btnPlay_MouseEnter" MouseLeave="btnPlay_MouseLeave"/>
<Image x:Name="imgScoreBoard" HorizontalAlignment="Left" Height="50" Margin="731,264,0,0" VerticalAlignment="Top" Width="145" Source="/img/btn/btn_scoreboard_red.png"/>
<Button x:Name="btnScoreBoard" Content="" HorizontalAlignment="Left" Margin="731,264,0,0" VerticalAlignment="Top" Width="145" Height="50" Opacity="0" Click="btnScoreBoard_Click" MouseEnter="btnScoreBoard_MouseEnter" MouseLeave="btnScoreBoard_MouseLeave"/>
<Image x:Name="imgProfile" HorizontalAlignment="Left" Height="50" Margin="731,319,0,0" VerticalAlignment="Top" Width="145" Source="/img/btn/btn_profile_red.png"/>
<Button x:Name="btnProfile" Content="" HorizontalAlignment="Left" Margin="731,319,0,0" VerticalAlignment="Top" Width="145" Height="50" Opacity="0" Click="btnProfile_Click" MouseEnter="btnProfile_MouseEnter" MouseLeave="btnProfile_MouseLeave"/>
<Image x:Name="imgHowToPlay" HorizontalAlignment="Left" Height="50" Margin="731,374,0,0" VerticalAlignment="Top" Width="145" Source="/img/btn/btn_howto_green.png"/>
<Image x:Name="imgLogOut" HorizontalAlignment="Left" Height="50" Margin="731,429,0,0" VerticalAlignment="Top" Width="145" Source="/img/btn/btn_logout_red.png"/>
<Button x:Name="btnLogOut" Content="" HorizontalAlignment="Left" Margin="731,429,0,0" VerticalAlignment="Top" Width="145" Height="50" Opacity="0" Click="btnLogOut_Click" MouseEnter="btnLogOut_MouseEnter" MouseLeave="btnLogOut_MouseLeave"/>
<TextBlock x:Name="lblDesc" HorizontalAlignment="Left" Margin="145,250,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="505" Height="195" Foreground="#FF007EFF" FontFamily="Comic Sans MS" FontSize="14.667" FontWeight="Bold">
<Run Text="There will be a set of 2 almost identical pictures revealed every month for players to identify 10 differences each."/>
<LineBreak/>
<Run/>
<LineBreak/>
<Run Text="With every correct click, a circle will appear on the difference spot; whereas every wrong click, the timer will be further reduced."/>
<LineBreak/>
<Run/>
<LineBreak/>
<Run Text="Total play time for this game is 30 seconds."/>
<LineBreak/>
<Run Text="(Hint: The faster you identify the differences, the higher the score)"/>
</TextBlock>
<TextBlock x:Name="lblHeader" Text="Spot 'd' Difference: How to Play Instruction" Margin="146,214,275,427" FontFamily="Comic Sans MS" FontSize="21.333" FontWeight="Bold" Width="472" Height="29" />
</Grid>
I'm having a lot of trouble trying to get this working, and was hoping someone could help.
I have a ScrollViewer in my WindowsPhone app, and I'm trying to emulate a similar control to the "Date/Time Chooser" that you'd see in the native Calendar app. So my ScrollViewer contains a StackPanel with multiple square Canvases with rectangles and TextBlocks. My intent is to watch the "ScrollStates", and when the VisualState changes to "NotScrolling", I'd then check the VerticalOffset of the ScrollViewer and animate a slide to the nearest "snap-to" position (ie. aligning the square to the correct/middle position).
<ScrollViewer Name="sv" Width="100" VerticalScrollBarVisibility="Hidden" HorizontalScrollBarVisibility="Disabled" Loaded="ScrollViewer_Loaded">
<StackPanel>
<Canvas MaxWidth="77" MaxHeight="80" MinWidth="80" MinHeight="80" Margin="3">
<Rectangle Stroke="{StaticResource PhoneForegroundBrush}" StrokeThickness="3" Width="80" Height="80" />
<TextBlock Text="1" FontSize="36" FontWeight="Bold" TextAlignment="Center" HorizontalAlignment="Center" Width="70" Canvas.Left="6" Canvas.Top="14" LineHeight="48" />
</Canvas>
<Canvas MaxWidth="77" MaxHeight="80" MinWidth="80" MinHeight="80" Margin="3">
<Rectangle Stroke="{StaticResource PhoneForegroundBrush}" StrokeThickness="3" Width="80" Height="80" />
<TextBlock Text="2" FontSize="36" FontWeight="Bold" TextAlignment="Center" HorizontalAlignment="Center" Width="70" Canvas.Left="6" Canvas.Top="14" LineHeight="48" />
</Canvas>
<Canvas MaxWidth="77" MaxHeight="80" MinWidth="80" MinHeight="80" Margin="3">
<Rectangle Stroke="{StaticResource PhoneForegroundBrush}" StrokeThickness="3" Width="80" Height="80" />
<TextBlock Text="3" FontSize="36" FontWeight="Bold" TextAlignment="Center" HorizontalAlignment="Center" Width="70" Canvas.Left="6" Canvas.Top="14" LineHeight="48" />
</Canvas>
...
</StackPanel>
</ScrollViewer>
I've been looking at various examples that hook into the VisualStates, like http://blogs.msdn.com/b/ptorr/archive/2010/07/23/how-to-detect-when-a-list-is-scrolling-or-not.aspx ; http://developingfor.net/2009/02/16/fun-with-the-wpf-scrollviewer/ ; http://blogs.msdn.com/b/slmperf/archive/2011/06/30/windows-phone-mango-change-listbox-how-to-detect-compression-end-of-scroll-states.aspx ... all seem to have similar code to this:
// Visual States are always on the first child of the control template
FrameworkElement element = VisualTreeHelper.GetChild(sv, 0) as FrameworkElement;
... which then goes on to seek out VisualStateGroup group = FindVisualState(element, "ScrollStates");, from which they can hook an Event to when it changes.
However... whenever I try doing the VisualTreeHelper.GetChild(sv,0) as FrameworkElement, the app crashes with an exception of type 'System.ArgumentOutOfRangeException'. If I output VisualTreeHelper.GetChildrenCount(sv), it is always "0". How is it seemingly working for everyone else? 8)
Any help would be greatly appreciated. Thanks!
(As an alternative, has anyone made this kind of "Select Box" already in a reusable control I could use instead of trying to reinvent it?)
Did you wait till the scrollviewer's Loaded event fires before trying to get the scrollviewer children??
I am using a rectangle and putting emotion images in it, and i want to do is if I make the rectangle hidden, the emotion images in it should be hidden.
I am attaching an image for help in it.
Please let me know which property should I use for getting this, in Windows Forms if we use panel, this can be done automatically. But in WPF C#, this is not done automatically.
Here is the code
<Rectangle Grid.ColumnSpan="2" Height="71" HorizontalAlignment="Left" Margin="226,262,0,0" Name="rectangle2" Stroke="Black" VerticalAlignment="Top" Width="192" Fill="#B5101010" Visibility="Hidden" />
<Image Height="27" HorizontalAlignment="Left" Margin="229,266,0,0" Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="28" Source="/WPFTEST;component/Images/emo/emotion_evilgrin.png" MouseUp="image1_MouseUp_1" Visibility="Hidden" />
<Image Height="27" HorizontalAlignment="Left" Margin="264,266,0,0" Name="image2" Source="/WPFTEST;component/Images/emo/emotion_grin.png" Stretch="Fill" VerticalAlignment="Top" Width="28" MouseUp="image2_MouseUp" Visibility="Hidden" />
<Image Height="27" HorizontalAlignment="Left" Margin="34,299,0,0" Name="image4" Source="/WPFTEST;component/Images/emo/emotion_tongue.png" Stretch="Fill" VerticalAlignment="Top" Width="28" Grid.Column="1" MouseUp="image4_MouseUp" Visibility="Hidden" />
<Image Height="27" HorizontalAlignment="Left" Margin="68,266,0,0" Name="image5" Source="/WPFTEST;component/Images/emo/emotion_suprised.png" Stretch="Fill" VerticalAlignment="Top" Width="28" Grid.Column="1" MouseUp="image5_MouseUp" Visibility="Hidden" />
<Image Height="27" HorizontalAlignment="Left" Margin="34,266,0,0" Name="image6" Source="/WPFTEST;component/Images/emo/emotion_smile.png" Stretch="Fill" VerticalAlignment="Top" Width="28" Grid.Column="1" MouseUp="image6_MouseUp" Visibility="Hidden" />
<Image Height="27" HorizontalAlignment="Left" Margin="0,266,0,0" Name="image7" Source="/WPFTEST;component/Images/emo/emotion_happy.png" Stretch="Fill" VerticalAlignment="Top" Width="28" Grid.Column="1" MouseUp="image7_MouseUp" Visibility="Hidden" />
<Image Height="27" HorizontalAlignment="Left" Margin="0,299,0,0" Name="image8" Source="/WPFTEST;component/Images/emo/emotion_wink.png" Stretch="Fill" VerticalAlignment="Top" Width="28" Grid.Column="1" MouseUp="image8_MouseUp" Visibility="Hidden" />
<Image Height="27" HorizontalAlignment="Left" Margin="230,299,0,0" Name="image9" Source="/WPFTEST;component/Images/emo/emotion_unhappy.png" Stretch="Fill" VerticalAlignment="Top" Width="28" MouseUp="image9_MouseUp" Visibility="Hidden" />
<Image Height="27" HorizontalAlignment="Left" Margin="265,299,0,0" Name="image10" Source="/WPFTEST;component/Images/emo/emotion_waii.png" Stretch="Fill" VerticalAlignment="Top" Width="28" MouseUp="image10_MouseUp" Visibility="Hidden" />
I know that it is not under the rectangle tag, but if i add images under rectangle tag then it causes error.
Thanks
Atif
If those icons are part of the "rectangle" which should be an ItemsControl or panel of some sort, the icons will hide if the parent container is hidden (Visibility = Visibility.Hidden/Collapsed).
Edit: The images are not part of the rectangle they are just placed on top using horrible margin abusing code.
There is no relationship between the rectangle and the icons. As i said, the icons need to be added as children of a container. (e.g. ItemsControl with WrapPanel as ItemsPanel) Surely winforms would not hide the icons either if they are not part of an owning container...
If you want to leave your code as is and not have to change those margins you can just bind the Visibility property of the icons to the Visibility property of the rectangle.
Visibility="{Binding Visibility, ElementName=rectangle2}"