I cannot understand why in the hell this simple silverlight application freezes up. Here is the code:
namespace test
{
public partial class MainPage : UserControl
{
TextBlock txtword;
public MainPage()
{
InitializeComponent();
txtword = new TextBlock();
txtword.Text = "TEST";
LayoutRoot.Children.Add(txtword);
}
private void button1_Click(object sender, RoutedEventArgs e)
{
txtword.Text = "SuperDuper";
}
}
}
After the textblock is added to the layoutroot if you try to hover or click on the button you can tell that the app has frozen for some reason. Any idea what is going on here??
If i add the text block in the XAML i am able to change its text property in the button click. LayoutRoot.Children.Add() is causing the app to freeze..
From reading your comments it seems the XAML in MainPage.xaml is something like the following:
<Grid x:Name="LayoutRoot" Background="White">
<Button Content="Do stuff" Click="Button_Click" />
</Grid>
After adding the TextBlock, either in code or in XAML, you effectively end up with the following:
<Grid x:Name="LayoutRoot" Background="White">
<Button Content="Do stuff" Click="Button_Click" />
<TextBlock Text="TEST" />
</Grid>
Your Grid doesn't specify any ColumnDefinitions or RowDefinitions, so you have a 1 × 1 grid with all child controls of the Grid given the entire width and height of the grid.
As neither your Button nor your TextBlock specify a z-index value (using Canvas.ZIndex), their z-order is defined by their position within the grid's Children. The TextBlock comes after the Button, so it is the one that is 'on top'.
The TextBlock may contain only a tiny amount of text, but the TextBlock itself will still fill the Grid. TextBlocks do not automatically resize to fit the text they contain and nothing else. Your Button appears not to work because the TextBlock is on top of it and receives all of the mouse events. TextBlocks are static controls that do nothing in response to any mouse event, and this should explain why your app is appearing to freeze.
Setting the HorizontalAlignment and/or VerticalAlignment of the TextBlock to a value other than Stretch stops the TextBlock being given the entire width and height of the Grid and allows the Button to receive mouse events.
Related
I'm trying to show a fullscreen popup along with application bar. To do this I'm using such code:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Button Name="myButton" Content="Show PopUP" Click="myButton_Click"/>
<Popup x:Name="myPopup">
<Grid Name="PopupsGrid" Background="ForestGreen">
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="This is my PopUp"/>
</Grid>
</Popup>
</Grid>
<Page.BottomAppBar>
<CommandBar>
<AppBarButton Label="Done" Icon="Setting"/>
<CommandBar.SecondaryCommands>
<AppBarButton Label="Command"/>
</CommandBar.SecondaryCommands>
</CommandBar>
</Page.BottomAppBar>
private void myButton_Click(object sender, RoutedEventArgs e)
{
var bounds = Windows.UI.ViewManagement.ApplicationView.GetForCurrentView().VisibleBounds;
PopupsGrid.Height = bounds.Height - 25; // to show the problem - normally we can substract BottomAppBar.Height
PopupsGrid.Width = bounds.Width;
myPopup.IsOpen = true;
}
I've figured out that we can use ApplicationView.GetForCurrentView().VisibleBounds to calculate the desired height. So far so good, but when I open the popup it overlaps the application bar (see picture 2). On the other hand once we open the appbar, it seems to be overlapped partially (see picture 3).
I've tested it both on desktop and mobile and the same problem occurs.
Am I missing something? How to put application bar above popup?
I don't think we can make sure commandbar is always above the popup. The popup command you saw in the third screenshot is actually a popup control so it can be above "myPopup" in this scenario. But, if you set the commandbar's IsSticky and IsOpen to true, when you click the button to show popup, it will hide the popup command. Popups follows this rule: latest on the top.
For the "overlapped partially" issue, instead of making the popup full screen, I think we can dynamically change the popup's height based on Commandbar's height.
One thing you may not notice is the height of LayoutRoot(Child of CommandBar) is larger than CommandBar's. By checking the default style of the CommandBar, you can find it uses Grid.Clip and RectangleGeometry.Transform to control the size of the commandbar we can see. You can also check it in the Live Visual Tree in VS. In my case, mycommandbar's Actual height is 48, and LayoutRoot's Actual Height is 60.
So as a workaround, in Compact mode, we can dynamically change the height of "myPopup" by listening the IsOpen property of the commandbar. If IsOpen = true, then substract the LayoutRoot's height(60), if IsOpen = false, substract the height of CommandBar(48).
This works for me.
Try to give your layout some padding ?
I have two TabItem's contained inside a TabControl.
Each TabItem contains serveral TextBox's.
When TabControl's OnSelectionChanged event is fired, as well as selecting the new TabItem, it is also setting focus on the first TextBox contained inside the newly selected item.
Is there any way to prevent this from happening?
Setting IsTabStop="False" on the TextBox will achieve this, but unfortunately also prevents the TextBox from being 'tabbed' into.
In your tab control, handle the focus event for each of the tabs like this:
<TabItem GotFocus="TabItem_OnGotFocus">
Then just remove focus using:
private void TabItem_OnGotFocus(object sender, RoutedEventArgs e)
{
Keyboard.ClearFocus();
}
Just add a container to your content as Grid, Stackpanel, Border, etc. and set it Focusable. When Tab selection change, the focus is set to the container and you can also use the tab key.
<TabItem Header="myHeader">
<StackPanel Focusable="True">
...
</StackPanel>
</TabItem>
#shannon it answers to your question about MVVM
I have an ObservableCollection<string> that is bound to an ItemsControl whose template is just a Button. The content of this button are 2 TextBlock. I'm trying to use the PreviewMouseRightButtonUp event of the button to toggle the visibility of one of the textblocks, but without being able to use xaml names for elements in the template I'm hitting a wall. Is there a way of getting to the button's content elements via sender in that preview event, or some other way of doing this? This is related to a previous question I had that didn't quite get a usable answer (probably due to my explanation, hence this simplified example). It seems to me that what should happen is I should make a control based off button that adds a property for this toggle, but that is basically what I thought I had in the previous question that wasn't working. I feel like a property and trigger is what most would say is the right way to go?
xaml:
<ItemsControl x:Name="iC" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<Button PreviewMouseRightButtonUp="Button_PreviewMouseRightButtonUp">
<DockPanel>
<TextBlock Text="normal" DockPanel.Dock="Top"/>
<TextBlock Text="{Binding}" DockPanel.Dock="Top" Visibility="Collapsed"/>
</DockPanel>
</Button>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
code behind:
ObservableCollection<string> x = new ObservableCollection<string>();
public MainWindow()
{
x.Add("1");
x.Add("2");
InitializeComponent();
iC.ItemsSource = x;
}
If you name the hidden text block "secondTextBlock", then this should work:
private void Button_PreviewMouseRightButtonUp(object sender, MouseButtonEventArgs e)
{
DockPanel dockPanel = (DockPanel)((Button)sender).Content;
TextBlock text = (TextBlock)LogicalTreeHelper.FindLogicalNode(dockPanel, "secondTextBlock");
if (text != null)
{
text.Visibility = Visibility.Visible;
}
}
Regarding your comment below: yes, multiple instances of "secondTextBlock" will be created. See the Snoop screenshot below. But these multiple instances are OK; they do not have any negative impact.
Basis: I am using the MVVM pattern or a subset of it.
In my main window I have a button that opens up a usercontrol with a new DataContext the function looks kinda like this:
public void SetUserControl()
{
UCDatacontext = new UCViewModel(this);
base.OnPropertyChanged("UCDatacontext");
UCViewVisibilty = Visibility.Visible;
UCDatacontext.IniFocus();
}
And then when I am done I close the usercontrol and Dispose of the DataContext. Now the problem I am having is that I can't seem to get the focus setting to work properly, I have a Textbox in the usercontrol that I want to set focus to when the view becomes Visible. However on the first time that I attempt to set focus it only fills the text box with an unblinking caret, which after investigation leads me to believe that it is because the TB isn't getting the Keyboard focus (only logical focus), however even after explicity setting the keyboard focus I still get the unblinking caret, and it is only after clicking in the TB that it is getting focus. The method I am using to set focus is similar to method described here.
If in the view I do some writeline debugging by printing out in the FocusSet Event for the textbox it does get set, however only on the first time I call SetUserControl(). If I call SetUserControl() again it does nothing, except making the View Visible but doesn't trigger the Focus Set Event.
Below is the lines of code from the MainWindow:
<Grid Grid.ColumnSpan="5" Grid.RowSpan="5" Visibility="{Binding Path=UCViewVisibilty }" x:Name="UCGrid" >
<Grid.Effect>
<DropShadowEffect />
</Grid.Effect>
<View:UCView DataContext="{Binding Path=UCDatacontext}" />
</Grid>
And UserControl Grid:
<Grid >
<TextBox Uid="UCTB" localExtensions:FocusExtension.IsFocused="{Binding Path=UCTBFocus}" Height="23" HorizontalAlignment="Left" Margin="113,56,0,0" Name="UCTB" VerticalAlignment="Top" Width="165" Text="{Binding Path=UCTBContent, UpdateSourceTrigger=PropertyChanged}" GotFocus="UCTB_GotFocus" />
</Grid >
The Focus is set in the UserControlViewModel, and is set after the Usercontrol is rendered.
it like this Set focus one by one from top to bottom.
InitializeComponent();
FocusManager.SetFocusedElement(this, TabItem); //this is Window , TabItem is UserControl in this Window
FocusManager.SetFocusedElement(TabItem, TextBox); // TabItem is UserControl and TextBox is Control in TabItem UC
I hope this will help.
As it turns out, after fiddling around with the code, the reason why the focus wasn't being set properly in the View was because the binding in the View Model was this:
bool _tBfocus;
public bool UCTBFocus
{
get { return _tBfocus; }
set
{
_tBfocus= value;
base.OnPropertyChanged("UCTBFocus");
}
instead of:
bool _tBfocus;
public bool UCTBFocus
{
get { return _tBfocus; }
set
{
if (_tBfocus == value)
return;
_tBfocus= value;
base.OnPropertyChanged("UCTBFocus");
}
}
After changing it everything worked fine :/ but if someone could explain to me why this annoyance I was having was caused by that I would be truly grateful :)
I am creating an application in WPF and the window has one main grid with 3 rows. There are 3 buttons in the 3rd row and on the click of each button, a panel is displayed in the 2nd grid row. I achieved this by setting the visibility option of the panels. However, now I would like to add an effect/animation as the panels become visible. I don't know where to start, so kindly help.
My xaml code is similar to this
<Window>
<Grid>
<!-- 3row definitions -->
<Grid Grid.Row="0"> </Grid>
<Grid Name="panel1" Grid.row="1" Visibility="Hidden"></Grid>
<Grid Name="panel2" Grid.row="1" Visibility="Hidden"></Grid>
<Grid Name="panel3" Grid.row="1" Visibility="Hidden"></Grid>
<Grid Grid.Row="2"></Grid>
</Grid>
</Windows>
Xaml.cs code to change the visibility is similar to this
private void Image_MouseLeftButtonDown(object sender, System.Windows.Input.MouseButtonEventArgs e)
{
panel1.Visibility = System.Windows.Visibility.Visible;
panel2.Visibility = System.Windows.Visibility.Hidden;
panel3.Visibility = System.Windows.Visibility.Hidden;
}
this can be done using expression studio, in expression blend open your wpf projects, there you can add animations to your wpf controls, you also need to start and stop animation when your application launches,
http://www.youtube.com/watch?v=JpGvl1TayAQ
here is a video tutorial, you can get more tutorials by googling it,