I would like to have previous/next arrows to select items in the treeview. I have 3 parent nodes that have childs. The parent nodes won't do anything so if I was at the end of the childs in parent node 1, I want the next arrow to select the 1st child in parent node 1. Same with the reverse if on the fist node of parent 2 and clicking previous will take me to the last child or parent node 1.
xaml of the treeview currently
<TreeView x:Name="tvMessages" HorizontalAlignment="Left" Height="363" Margin="10,37,0,0" VerticalAlignment="Top" Width="312" SelectedItemChanged="tvMessages_SelectedItemChanged">
<TreeViewItem x:Name="itemsCritical">
<TreeViewItem.Header>
<StackPanel Orientation="Horizontal">
<Image Source="/FlashSystem/Images/Critical.png" Height="16px" Width="16px"/>
<TextBlock Margin="5,0" Text="Critical"/>
</StackPanel>
</TreeViewItem.Header>
<TreeViewItem.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="/FlashSystem/Images/Message.png" Width="16px" Height="16px"/>
<TextBlock Margin="5,0" Text="{Binding Description}"/>
<TextBlock Text="{Binding ID}" Visibility="Hidden"/>
<TextBlock Text="{Binding Specility}" Visibility="Hidden"/>
<TextBlock Text="{Binding IssuedDate}" Visibility="Hidden"/>
<TextBlock Text="{Binding Severity}" Visibility="Hidden"/>
</StackPanel>
</DataTemplate>
</TreeViewItem.ItemTemplate>
</TreeViewItem>
<TreeViewItem x:Name="itemsAlert">
<TreeViewItem.Header>
<StackPanel Orientation="Horizontal">
<Image Source="/FlashSystem/Images/Alert.png" Height="16px" Width="16px"/>
<TextBlock Margin="5,0" Text="Alert"/>
</StackPanel>
</TreeViewItem.Header>
<TreeViewItem.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="/FlashSystem/Images/Message.png" Width="16px" Height="16px"/>
<TextBlock Margin="5,0" Text="{Binding Description}"/>
<TextBlock Text="{Binding ID}" Visibility="Hidden"/>
<TextBlock Text="{Binding Specility}" Visibility="Hidden"/>
<TextBlock Text="{Binding IssuedDate}" Visibility="Hidden"/>
<TextBlock Text="{Binding Severity}" Visibility="Hidden"/>
</StackPanel>
</DataTemplate>
</TreeViewItem.ItemTemplate>
</TreeViewItem>
<TreeViewItem x:Name="itemsInformational">
<TreeViewItem.Header>
<StackPanel Orientation="Horizontal">
<Image Source="/FlashSystem/Images/Info.png" Height="16px" Width="16px"/>
<TextBlock Margin="5,0" Text="Informational"/>
</StackPanel>
</TreeViewItem.Header>
<TreeViewItem.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="/FlashSystem/Images/Message.png" Width="16px" Height="16px"/>
<TextBlock Margin="5,0" Text="{Binding Description}"/>
<TextBlock Text="{Binding ID}" Visibility="Hidden"/>
<TextBlock Text="{Binding Specility}" Visibility="Hidden"/>
<TextBlock Text="{Binding IssuedDate}" Visibility="Hidden"/>
<TextBlock Text="{Binding Severity}" Visibility="Hidden"/>
</StackPanel>
</DataTemplate>
</TreeViewItem.ItemTemplate>
</TreeViewItem>
</TreeView>
I would try to simulate the key down event and see if it works.
If you simulate the arrow key down event the TreeViewItem will do the job for you. It will either expand itself or move the selection to its Children[0] item.
Internally TreeViewItem listens to KeyDown and it works with ItemContainerGenerator to find the Children[0] item.
Here is how you can simulate arrow key in WPF:
var backKey = new KeyEventArgs(Keyboard.PrimaryDevice, Keyboard.PrimaryDevice.ActiveSource, 0, Key.Back);
backKey.RoutedEvent = Keyboard.KeyDownEvent;
InputManager.Current.ProcessInput(backKey);
You wont need the back key you will need the right or left arrow still you will need InputManager to process input :)
Related
I want to design a Control Similar to this, where to the left corner would be Some Text and right corner will have Checkbox mark.
I tried doing something like this.
<ListView x:Name="MyListView">
<ListView.ItemTemplate>
<DataTemplate x:Name="DoubleLineDataTemplate" >
<CheckBox IsChecked="{Binding IsChecked}">
<StackPanel Orientation="Horizontal">
<Image VerticalAlignment="Center" Source="{Binding Img}">
</Image>
<StackPanel Orientation="Vertical" VerticalAlignment="Center" Margin="12,0,0,0">
<TextBlock Text="{Binding Name}" />
</StackPanel>
</StackPanel>
</CheckBox>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
But the output isn't what I want.
you can put Image, text and checkbox in a single Grid and stick text and checkbox to corners:
<ListView x:Name="MyListView">
<ListView.ItemTemplate>
<DataTemplate x:Name="DoubleLineDataTemplate" >
<Grid>
<Image VerticalAlignment="Center" Source="{Binding Img}"/>
<TextBlock Text="{Binding Name}"
VerticalAlignment="Top" HorizontalAlignment="Left" Margin="5"/>
<CheckBox IsChecked="{Binding IsChecked}"
VerticalAlignment="Top" HorizontalAlignment="Right" Margin="5"/>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
i am using grid view control for to show data,
problem is, my few text is very long and it is not warping correctlly
xaml is like this :
<GridView x:Name="itemGridView" Grid.Row="2" Margin="30,20,0,0" AutomationProperties.AutomationId="ItemsGridView" AutomationProperties.Name="Items" TabIndex="1" Grid.RowSpan="2" ItemsSource="{Binding EquipBookingCollection}" ItemTemplate="{StaticResource Standard250x250ItemTemplate}" SelectionMode="None" IsSwipeEnabled="false" IsItemClickEnabled="True" ItemClick="ItemView_ItemClick"/>
and ItemTemplate is like this :
<DataTemplate x:Key="Standard250x250ItemTemplate">
<Grid HorizontalAlignment="Left">
<StackPanel Margin="5">
<StackPanel Orientation="Horizontal" Margin="3,0">
<TextBlock Text="Start Time : " Style="{StaticResource TitleTextStyle}"></TextBlock>
<TextBlock Text="{Binding BookedFromDteTme }" TextWrapping="Wrap" Style="{StaticResource SubtitleTextStyle}" Margin="4,0,0,0"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="3,0">
<TextBlock Text="Finish Time: " Style="{StaticResource TitleTextStyle}" ></TextBlock>
<TextBlock Text="{Binding BookedToDteTme }" TextWrapping="Wrap" Style="{StaticResource SubtitleTextStyle}" Margin="4,0,0,0"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="3,0">
<TextBlock Text="Task Address : " Style="{StaticResource TitleTextStyle}" ></TextBlock>
<TextBlock Text="{Binding TaskAddress}" TextWrapping="Wrap" Style="{StaticResource SubtitleTextStyle}" Margin="4,0,0,0"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="3,0">
<TextBlock Text="Task Description : " Style="{StaticResource TitleTextStyle}" ></TextBlock>
<TextBlock Text="{Binding TaskDescription}" TextWrapping="Wrap" Style="{StaticResource SubtitleTextStyle}" Margin="4,0,0,0"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="3,0">
<TextBlock Text="Client Company : " Style="{StaticResource TitleTextStyle}" ></TextBlock>
<TextBlock Text="{Binding ClientCompany}" TextWrapping="Wrap" Style="{StaticResource SubtitleTextStyle}" Margin="4,0,0,0"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="3,0">
<TextBlock Text="Status Name : " Style="{StaticResource TitleTextStyle}" ></TextBlock>
<TextBlock Text="{Binding Status.Description}" TextWrapping="Wrap" Style="{StaticResource SubtitleTextStyle}" Margin="4,0,0,0" Foreground="Red"/>
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
please help me with this, thanks
This is a related issue to TextBlock TextWrapping not wrapping inside StackPanel
In short, you'll want to stop using StackPanel control and use the much better Grid control instead.
Set the width property of textblock
<TextBlock Text="{Binding BookedFromDteTme }" TextWrapping="Wrap" Style="{StaticResource SubtitleTextStyle}" Margin="4,0,0,0" Width = "200"/>
Instead of StackPanel you can use WrapPanel
</WrapPanel>
I have a listbox in my windows phone application. In the listbox DataTemplate I placed a button. How can I get the button object in codebehind. I am not getting the reference of the rowButton in the .cs file. I want to change the button background color of button of each row. how can I get the button reference in the code behind ?
I following code I used for listview.
<Grid Height="530" Grid.Row="1" VerticalAlignment="Top" Margin="0,30,0,0">
<ListBox Margin="0,0,0,0" Name="TransactionList">
<ListBox.ItemTemplate>
<DataTemplate>
<Button Width="460" Height="150" Click="user_click" Name="rowButton" >
<Button.Content>
<StackPanel Orientation="Horizontal" Height="auto" Width="400">
<Image Width="80" Height="80" Source="{Binding Type}"></Image>
<StackPanel Orientation="Vertical" Height="150" Margin="20,0,0,0">
<StackPanel Orientation="Horizontal" Height="40">
<TextBlock Width="100" FontSize="22" Text="Name :" Height="40" ></TextBlock>
<TextBlock Width="auto" FontSize="22" Text="{Binding Name}" Height="40" ></TextBlock>
</StackPanel>
<StackPanel Orientation="Horizontal" Height="40">
<TextBlock Width="100" FontSize="22" Text="Date :" Height="40" ></TextBlock>
<TextBlock Width="100" FontSize="22" Text="{Binding Date}" Height="40" ></TextBlock>
</StackPanel>
<StackPanel Orientation="Horizontal" Height="40">
<TextBlock Width="100" FontSize="22" Text="Amount :" Height="40" ></TextBlock>
<TextBlock Width="auto" FontSize="22" Text="{Binding Amount}" Height="40" ></TextBlock>
<TextBlock Width="auto" FontSize="22" Text=" $" Height="40" ></TextBlock>
</StackPanel>
</StackPanel>
</StackPanel>
</Button.Content>
</Button>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
If you want to change background on user click, in the click event handler use
Button button1 = sender as Button;
button1.Backgorund = new SolidColorBrush(Colors.Red);
to change the background color.
Else bind the background property for each button and change its value on iteration of the items in the listbox.
Without seeing how you've tried to access this is in code it's impossible to say why what you're doing isn't working.
However it'll be much easier if you use databinding to set the color of the templateitem
I have a twitter feed in a list box in a app I'm making for Windows Phone 7. The problem I'm having is that the text of a tweet is being cut off the edge of the list box instead of wrapping around to a new line like this:
The list box is inside a panorama which works fine. This is my code:
<ListBox x:Name="cheapyListBox" Height="500" HorizontalAlignment="Left" Margin="0,0,0,0" VerticalAlignment="Top" Width="400" ScrollViewer.VerticalScrollBarVisibility="Hidden" HorizontalContentAlignment="Left" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Height="132" Tap="Message_OnTap">
<Image Source="{Binding ImageSource}" Height="73" Width="73" VerticalAlignment="Top" Margin="0,10,8,0"/>
<StackPanel Width="Auto">
<!--<TextBlock Text="{Binding UserName}" FontSize="28" Margin="12,0,0,0" /> -->
<TextBlock Text="{Binding Message}" TextWrapping="Wrap" FontSize="24" />
<TextBlock Text="{Binding Date}" TextWrapping="Wrap" FontSize="20" />
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
How can I get the tweet text to wrap round instead of being cut off? Thank you.
Since your inner StackPanel is nested within a horizontal Stackpanel, it has no constraint of depth, and so the TextBlocks expand infinitely as the text becomes longer.
There are a variety of ways you can fix the issue, but an easy one (if you know the width that you want) is to set the inner StackPanel's width to a finite number.
For example:
<ListBox x:Name="cheapyListBox" Height="500" HorizontalAlignment="Left" Margin="0,0,0,0" VerticalAlignment="Top" Width="400" ScrollViewer.VerticalScrollBarVisibility="Hidden" HorizontalContentAlignment="Left" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Height="132" Tap="Message_OnTap">
<Image Source="{Binding ImageSource}" Height="73" Width="73" VerticalAlignment="Top" Margin="0,10,8,0"/>
<StackPanel Width="400">
<!--<TextBlock Text="{Binding UserName}" FontSize="28" Margin="12,0,0,0" /> -->
<TextBlock Text="{Binding Message}" TextWrapping="Wrap" FontSize="24" />
<TextBlock Text="{Binding Date}" TextWrapping="Wrap" FontSize="20" />
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Hope this helps!
The items below show up normally when I do not have them inside the HyperlinkButton.
However, when I add them to the HyperlinkButton, they become invisible.
<DataTemplate>
<HyperlinkButton NavigateUri="/ViewChallenge.aspx">
<HyperlinkButton.Content>
<StackPanel Orientation="Horizontal" Margin="0,0,0,17">
<Image Height="100" Width="100" Source="{Binding Path=Challenge.Image}" Margin="12,0,9,0"/>
<StackPanel Width="311">
<TextBlock Text="{Binding Path=Challenge.Title}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<HyperlinkButton NavigateUri="ViewUser.aspx" >
<HyperlinkButton.Content>
<TextBlock Text="{Binding Path=User.Username}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
</HyperlinkButton.Content>
</HyperlinkButton>
</StackPanel>
</StackPanel>
</HyperlinkButton.Content>
</HyperlinkButton>
</DataTemplate>
As far as I know, the Hyperlink button only supports text. For example:
<HyperlinkButton Height="100" Width="300">
Hello World
</HyperlinkButton>
Maybe you should use a Button control and set a Control template and enter the XAML you mentioned above inside. It makes more sense in my opinion. Try this:
<ControlTemplate x:Key="MyButtonTemplate" TargetType="Button">
<StackPanel Orientation="Horizontal" Margin="0,0,0,17">
<Image Height="100" Width="100" Source="{Binding Path=Challenge.Image}" Margin="12,0,9,0"/>
<StackPanel Width="311">
<TextBlock Text="{Binding Path=Challenge.Title}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<TextBlock Text="{Binding Path=User.Username}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
</StackPanel>
</StackPanel>
</ControlTemplate>
And simply set the template for your button like so:
<Button x:Name="myButton" Template="{StaticResource MyButtonTemplate}" Click="myButton_Click"/>
And then do the navigation inside the click event.