I've got RadGridView with few columns. In one column I've got CellTemplate and CellEditTemplate. I would like to fill cell with my combobox, but regardless setting cell padding to 0 and VerticalAligment to Stretch it still have got one line height with margins on top and bottom. Anyone have any sugestion?
<Style x:Name="BookCellStyle" TargetType="telerik:GridViewCell">
<Setter Property="Padding" Value="0"/>
</Style>
<telerik:GridViewDataColumn Width="*"
MinWidth="200"
TextAlignment="Center"
IsReadOnly="False"
CellStyle="{StaticResource BookCellStyle}"
DataMemberBinding="{Binding BookId, Mode=TwoWay, NotifyOnValidationError=True}">
<telerik:GridViewDataColumn.CellTemplate>
<DataTemplate DataType="models:BookObject">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="15"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{Binding Path=BookNumber}" Margin="4,4,0,4"/>
<TextBlock Grid.Column="1" Text="-" HorizontalAlignment="Center" Margin="0,4"/>
<TextBlock Grid.Column="2" Text="{Binding Path=BookName}" TextWrapping="Wrap" MaxWidth="360" Margin="0,4,4,4"/>
</Grid>
</DataTemplate>
</telerik:GridViewDataColumn.CellTemplate>
<telerik:GridViewDataColumn.CellEditTemplate>
<DataTemplate DataType="models:BookObject">
<telerik:RadComboBox
ItemsSource="{Binding Path=Books}"
SelectedValuePath="Guid"
SelectedValue="{Binding Path=BookId, Mode=TwoWay, NotifyOnValidationError=True}">
<telerik:RadComboBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="15"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{Binding Path=BookNumber}" Margin="0,4"/>
<TextBlock Grid.Column="1" Text="-" HorizontalAlignment="Center" Margin="0,4"/>
<TextBlock Grid.Column="2" Text="{Binding Path=BookName}" TextWrapping="Wrap" MaxWidth="360" Margin="0,4"/>
</Grid>
</DataTemplate>
</telerik:RadComboBox.ItemTemplate>
</telerik:RadComboBox>
</DataTemplate>
</telerik:GridViewDataColumn.CellEditTemplate>
</telerik:GridViewDataColumn>
Related
How to use Gird in Windows Apps?
I want to create a Login form. I have used grid and used but the Rows are not aligned properly, How can I do that?
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="67*"/>
<ColumnDefinition Width="293*"/>
</Grid.ColumnDefinitions>
<StackPanel>
<TextBlock Text="Name" Height="32" Margin="0,0,0.333,0" ></TextBlock>
<TextBlock Text="Last Name" Height="30" Margin="0,0,0.333,0" ></TextBlock>
<TextBlock Text="Address"></TextBlock>
</StackPanel>
<StackPanel Grid.Column="1">
<TextBox></TextBox>
<TextBox></TextBox>
<TextBox></TextBox>
</StackPanel>
</Grid>
You should define the rows and columns in Grid.
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="67*"/>
<ColumnDefinition Width="293*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="45"></RowDefinition>
<RowDefinition Height="45"></RowDefinition>
<RowDefinition Height="45"></RowDefinition>
</Grid.RowDefinitions>
<TextBlock Text="Name" Grid.Column="0" Grid.Row="0" VerticalAlignment="Center"></TextBlock>
<TextBlock Text="Last Name" Grid.Column="0" Grid.Row="1" VerticalAlignment="Center"></TextBlock>
<TextBlock Text="Address" Grid.Column="0" Grid.Row="2" VerticalAlignment="Center"></TextBlock>
<TextBox Grid.Column="1" Grid.Row="0" Height="30"></TextBox>
<TextBox Grid.Column="1" Grid.Row="1" Height="30"></TextBox>
<TextBox Grid.Column="1" Grid.Row="2" Height="30"></TextBox>
</Grid>
I am using auto complete textbox from windows phone toolkit.I need the list of suggestions below my textbox but it shows up above the text box .How do I make the suggestions appear below the text box..Here is my XAML.
<Grid Margin="0,336,0,189" x:Name="editrow" Visibility="Visible">
<Grid.RowDefinitions>
<RowDefinition Height="auto"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="220" ></ColumnDefinition>
<ColumnDefinition Width="100"></ColumnDefinition>
<ColumnDefinition Width="100"></ColumnDefinition>
</Grid.ColumnDefinitions>
<toolkit:AutoCompleteBox x:Name="newname" FilterMode="StartsWith" IsTextCompletionEnabled="True" Foreground="White" Background="#53000000" BorderThickness="0" Grid.Column="0" Grid.Row="0" Margin="10,0,0,0" IsDropDownOpen="True" RenderTransformOrigin="0,0">
<toolkit:AutoCompleteBox.ItemTemplate>
<DataTemplate>
<StackPanel Background="Gray" Orientation="Horizontal">
<TextBlock Text="{Binding }"/>
</StackPanel>
</DataTemplate>
</toolkit:AutoCompleteBox.ItemTemplate>
</toolkit:AutoCompleteBox>
<TextBox x:Name="rowquantity" Foreground="White" Background="#53000000" BorderThickness="0" Grid.Column="1" Grid.Row="0" InputScope="Number"></TextBox>
<toolkit:ListPicker Grid.Row="0" x:Name="units" Foreground="White" BorderThickness="0" Background="#53000000" Grid.Column="2" ExpansionMode="FullScreenOnly" Margin="12,5,0,14" >
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Margin="0 0 0 0">
<TextBlock Text="{Binding}"
FontSize="32" LineHeight="1"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>
<Button Content="Add" BorderBrush="#53000000" Foreground="#53000000" Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="1" HorizontalAlignment="Right" VerticalAlignment="Top" Height="74" Click="Button_Click" Margin="0,0,3,0" Width="158"/>
</Grid>
The location of the popup is determined based on the available size. If there's more space above the AutoCompleteTextBox, it will pop up. You can see this in the popuphelper.cs source file where the code arranges the popup.
There really isn't an option to override the behavior.
So I have a listbox with a template in which I bind an ObservableCollection of objects called "TotalDebits".
I have two way to delete the items:
One by one through a context menu
By range through a delete button and by fetching the checked objects.
This works:
private void Delete_Click(object sender, RoutedEventArgs e)
{
DeleteDebit((DirectDebit)(((MenuItem)sender).DataContext));
}
private void DeleteDebit(DirectDebit ddb)
{
TotalDebits.Remove(ddb);
}
private void delete_Click(object sender, EventArgs e)
{
DeleteDebitList();
}
private void DeleteDebitList()
{
try
{
foreach (var ddb in TotalDebits.ToList())
if (ddb.IsChecked)
TotalDebits.Remove(ddb);
}
catch
{
}
}
In both case, the items are properly deleted, the problem is, in the second case, the keyboard is showing up right after the items are deleted, for absolutely no reason.. Of course I can hide it right after by focusing on the list but it looks ugly and I wish I could find a way to prevent this issue from happening.
Edit:
You'll find hereunder the xaml of the page:
<controls:PivotItem Header="Direct Debit" >
<Grid>
<Grid.Resources>
<Storyboard x:Name="ListboxSizeIncrease">
<DoubleAnimation Storyboard.TargetName="DebitList" Storyboard.TargetProperty="Height"
From="475" To="380" Duration="0:0:.5"/>
</Storyboard>
<Storyboard x:Name="ListboxSizeDecrease">
<DoubleAnimation Storyboard.TargetName="DebitList" Storyboard.TargetProperty="Height"
From="380" To="475" Duration="0:0:.5"/>
</Storyboard>
</Grid.Resources>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ListBox Grid.Row="0" x:Name="DebitList" Height="475" Margin="10,5,10,0" Tap="ListBox_Tap" ItemsSource="{Binding TotalDebits}" VerticalAlignment="Top" ItemContainerStyle="{StaticResource CustomListBoxItem}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,2,0,2">
<Grid Margin="5,5,5,5" HorizontalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60" />
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<CheckBox x:Name="CheckItem" Grid.Column="0" IsChecked="{Binding IsChecked}" Checked="CheckItem_Checked" Unchecked="CheckItem_Unchecked" />
<TextBlock x:Name="DescriptionBlock" FontSize="24" Grid.Column ="1" Text="{Binding Description}" HorizontalAlignment="Left" VerticalAlignment="Center">
</TextBlock>
<TextBlock FontSize="24" Grid.Column ="2" Text="{Binding Amount}" TextAlignment="Right" HorizontalAlignment="Right" VerticalAlignment="Center"/>
</Grid>
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu Name="ContextMenu" IsZoomEnabled="False">
<toolkit:MenuItem Name="Edit" Header="Edit" Click="Edit_Click"/>
<toolkit:MenuItem Name="Delete" Header="Delete" Click="Delete_Click"/>
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Border Margin="12,5,12,5" Grid.Row="1" Background="LightGray"/>
<Grid Grid.Row="1" Margin="14,8,14,8">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="TOTAL DIRECT DEBIT" FontSize="28" FontWeight="Bold" Foreground="DarkSlateGray"/>
<TextBlock Grid.Column="1" x:Name="TotalBlock" Text="{Binding TotalValue}" FontSize="28" FontWeight="Bold" Foreground="DarkSlateGray"/>
</Grid>
<Grid Grid.Row="2">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Border Margin="12,5,12,5" Background="LightGray">
<Grid Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="300"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel Orientation="Vertical" Grid.Column="0">
<TextBlock Margin="10,0,0,0" Text="Description" FontSize="20" Foreground="DarkSlateGray"/>
<TextBox x:Name="DescriptionBox" FontSize="15" />
</StackPanel>
<Grid Grid.Column="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<StackPanel Orientation="Vertical" Grid.Column="0">
<TextBlock Margin="0,0,0,0" Text="Amount" Foreground="DarkSlateGray"/>
<TextBox x:Name="AmountBox" FontSize="15" />
</StackPanel>
<StackPanel Orientation="Vertical" Grid.Column="1">
<TextBlock Margin="10,0,0,0" Text="." Foreground="DarkSlateGray"/>
<TextBox x:Name="DecimalBox" Width="60" FontSize="15" MaxLength="2"/>
</StackPanel>
</Grid>
</Grid>
</Border>
</Grid>
</Grid>
</controls:PivotItem>
I need to hide vertical scrollbar in LongListSelector. For this I use:
ScrollViewer.VerticalScrollBarVisibility="Hidden"
In ListBox it works well but in LongListSelector it doesn't work.
This is my LongListSelector code:
<Grid x:Name="ContentPanel"
Grid.Row="1"
Margin="12,0,12,0">
<toolkit:LongListSelector x:Name="TasksLongListSelector"
Margin="0,12,0,0"
Background="Transparent"
ScrollViewer.VerticalScrollBarVisibility="Hidden">
<toolkit:LongListSelector.GroupHeaderTemplate>
<DataTemplate>
<Border Width="431"
Height="53"
HorizontalAlignment="Left"
BorderThickness="2"
BorderBrush="White"
Margin="13,0,0,22">
<Grid HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<TextBlock Text="{Binding Key, Converter={StaticResource LocalDateConverter}}"
FontSize="20"
FontWeight="Bold"
Foreground="White"
HorizontalAlignment="Left"
Padding="14,10,0,0" />
<Image Grid.Column="1"
Source="/Images/CalendarWhiteIcon.png"
Width="21"
Height="21"
HorizontalAlignment="Right"
VerticalAlignment="Top"
Margin="0,13,14,0" />
</Grid>
</Border>
</DataTemplate>
</toolkit:LongListSelector.GroupHeaderTemplate>
<toolkit:LongListSelector.ItemTemplate>
<DataTemplate>
<Button Background="White"
Width="455"
Height="105"
Margin="0,-12,0,12"
Tag="{Binding Id}"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
Click="Button_Click_1">
<Grid HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="24" />
</Grid.RowDefinitions>
<TextBlock Grid.ColumnSpan="4"
Text="{Binding Name}"
FontSize="24"
Foreground="#400000" />
<Image Grid.Row="1"
Visibility="{Binding Project, Converter={StaticResource StringToVisibilityConverter}}"
Source="/Images/ProjectIcon.png"
Width="20"
Height="18"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Margin="0,0,5,0" />
<TextBlock Grid.Row="1"
Grid.Column="1"
Visibility="{Binding Project, Converter={StaticResource StringToVisibilityConverter}}"
Text="{Binding Project, Converter={StaticResource ToUppercaseConverter}}"
FontSize="16"
Foreground="#666666"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Margin="0,-2,9,0"
LineStackingStrategy="BlockLineHeight" />
<Image Grid.Row="1"
Grid.Column="2"
Visibility="{Binding Context, Converter={StaticResource StringToVisibilityConverter}}"
Source="/Images/ContextIcon.png"
Width="20"
Height="18"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Margin="-3,1,1,0" />
<TextBlock Grid.Row="1"
Grid.Column="3"
Visibility="{Binding Context, Converter={StaticResource StringToVisibilityConverter}}"
Text="{Binding Context, Converter={StaticResource ToUppercaseConverter}}"
FontSize="16"
Foreground="#666666"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Margin="0,-2,0,0"
LineStackingStrategy="BlockLineHeight" />
</Grid>
</Button>
</DataTemplate>
</toolkit:LongListSelector.ItemTemplate>
</toolkit:LongListSelector>
</Grid>
How can I hide vertical scrollbar in LongListSelector?
I found solution. To LongListSelector event Loaded add this code:
ScrollViewer sv = VisualTreeHelper.GetChild(VisualTreeHelper.GetChild(TasksLongListSelector, 0), 0) as ScrollViewer;
ScrollBar sb = ((FrameworkElement)VisualTreeHelper.GetChild(sv, 0)).FindName("VerticalScrollBar") as ScrollBar;
sb.Width = 0;
I want to add context menu to listbox. But when I hold to listbox item, nothing happens.
Thanks..
This code is definition of my listbox. I added context menu into listbox.
<ListBox Grid.Row="1" Name="chList" ItemsSource="{Binding Ch.Texts}" SelectionChanged="TextChanged" Style="{StaticResource ListOfText}">
<ListBox.ItemTemplate>
<DataTemplate>
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu Name="ContextMenu">
<toolkit:MenuItem Name="Edit" Header="Edit" Click="Edit_Click"/>
<toolkit:MenuItem Name="Delete" Header="Delete" Click="Delete_Click"/>
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
</DataTemplate>
</ListBox.ItemTemplate>
</Listbox>
in styles.xaml
<Style x:Key="ListOfText" TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Border x:Name="RootElement" Padding="{StaticResource PhoneBorderThickness}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Border Grid.Column="0" Background="{StaticResource PhoneAccentBrush}"
Opacity="{Binding IsRead,Converter={StaticResource opacityConverter}}" />
<Grid MinHeight="60" Grid.Column="1">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Text="{Binding Title}" TextWrapping="Wrap"
Style="{StaticResource PhoneTextTitle3Style}" />
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{Binding PbDate, Converter={StaticResource dateConverter}}"
VerticalAlignment="Center" TextWrapping="Wrap" Style="{StaticResource PhoneTextSmallStyle}" />
<Image Grid.Column="1" Height="{StaticResource PhoneFontSizeNormal}" HorizontalAlignment="Left"
Visibility="{Binding IsStared,Converter={StaticResource visibilityConverter}}" Source="/Toolkit.Content/favs.png" />
</Grid>
</Grid>
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Styles.xaml in mysolution... but I can't solve this problem..
Thanks...
You are setting the item DataTemplate to be a ContextMenuService.ContextMenu and there is no actual content. You need to actually have some content displayed there. Also, do you have any items in the list?
Move the ContextMenuService.ContextMenu in one main template - currently you are splitting it (for an unknown reason). Remove the DataTemplate declaration in the ListBox control itself and use your pre-defined style.