I am working on generating a list of check boxes with the first check box to be "SelectAll". SelectAll checkbox will check or uncheck all the check box in the list. However my check list is binding to a data source. Right now I want to put all check box including selectAll check box in the same wrappanel so that they can be wrapped together at the end of the panel.
<ContentControl Name="FilterContent">
<WrapPanel Orientation="Horizontal" HorizontalAlignment="Stretch">
<CheckBox Name="SelectedAll" MinWidth="100" Margin="2"
VerticalAlignment="Center" HorizontalAlignment="Left"
IsChecked="{Binding IsSelectAll, Mode=TwoWay}"
Content="{Binding Path=SelectAllText}">
<i:Interaction.Triggers>
<i:EventTrigger EventName="Click">
<cmd:EventToCommand Command="{Binding Path=OnClickCommand}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</CheckBox>
<ItemsControl ItemsSource="{Binding StandardItems}"
Margin="2,5,2,-1"
BorderBrush="{x:Null}"
Background="Transparent"
Grid.ColumnSpan="2"
ScrollViewer.VerticalScrollBarVisibility="Hidden"
ScrollViewer.HorizontalScrollBarVisibility="Hidden">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Name="ItemsPanel" Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<CheckBox Name="ItemCheckBox"
MinWidth="100" Margin="2"
VerticalAlignment="Center" HorizontalAlignment="Left"
IsChecked="{Binding Path=IsChecked, Mode=TwoWay}"
Content="{Binding Path=Label}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</WrapPanel>
</ContentControl>
This piece of code does not allow me to do that, the result UI only have the items inside item control wrapped in the second line but not consider all check box in the same wrappanel. I need help on adding "SelectAll" check box to the wrappanel that is used by itemscontrol.
Thank you!
When loading the control I would add an empty StandardItem in the StandardItems list which will mean "select all". When I process the checkbox click event, I check if the item is an empty item and I use this as a call to "select all"
Related
I Installed CarouselView.FormsPlugin 6.0.0 on PCL Project
It's Working Fine on Android But When I Use On Ios facing Frame height not cover fully on CarouselView ItemTemplate
Code:-
<StackLayout>
<RefreshView>
<CollectionView x:Name="CollView">
<CollectionView.ItemTemplate>
<DataTemplate>
<cv:CarouselViewControl HeightRequest="110" AnimateTransition="False" ShowIndicators="True" Position="0" InfiniteScrolling="True" InterPageSpacing="20" VerticalOptions="Fill" HorizontalOptions="FillAndExpand" IsSwipeEnabled="True" AutoplayInterval="5" IndicatorsTintColor="#E5E5E5" ItemsSource="{Binding HomeDisplayOffers}" HorizontalIndicatorsPosition="Bottom">
<cv:CarouselViewControl.ItemTemplate >
<DataTemplate >
<StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<Frame Padding="0" HeightRequest="110" "HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<!--- Binding Source Code --->
</Frame>
</StackLayout
</DataTemplate >
</cv:CarouselViewControl.ItemTemplate>
</cv:CarouselViewControl>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</RefreshView>
</StackLayout>
pls Check the Attached Screenshot.. Some Frame Coverup and Some Frame Getting Space on Bottom
That has nothing to do with the control and everything to do with your XAML code, Giving it a static height is going to obviously do this, options that you have are quite simple to be honest get a container that covers the whole frame like Absolute or Grid
<AbsoluteLayout>
<cv:CarouselViewControl AnimateTransition="False" ShowIndicators="True" Position="0" InfiniteScrolling="True" InterPageSpacing="20" AbsoluteLayout.LayoutBounds="0,0,1,1"
AbsoluteLayout.LayoutFlags="All" VerticalOptions="Fill" HorizontalOptions="FillAndExpand" IsSwipeEnabled="True" AutoplayInterval="5" IndicatorsTintColor="#E5E5E5" ItemsSource="{Binding HomeDisplayOffers}" HorizontalIndicatorsPosition="Bottom">
<cv:CarouselViewControl.ItemTemplate >
<DataTemplate >
<Frame Padding="0">
<!--- Binding Source Code --->
</Frame>
</StackLayout
</DataTemplate >
</cv:CarouselViewControl.ItemTemplate>
</cv:CarouselViewControl>
</AbsoluteLayout>
I am using a Material Card on my Uno based app. It works great- except I am trying to add a Pathicon for MediaContent and am having trouble getting it to work. I tried overriding the Image source in the template- but that did not work- I may not have done that right. Essentially I want a Pathicon where the .png or jpg would go. Any suggestions on how to accomplish this would be appreciated.
<material:Card HeaderContent="Outlined card"
SubHeaderContent="With title and subtitle only"
MediaContent=""
Style="{StaticResource MaterialOutlinedCardStyle}"
PointerExited="eventPageClick">
<material:Card.HeaderContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"
Margin="16,14,16,0"
Style="{ThemeResource MaterialHeadline6}" />
</DataTemplate>
</material:Card.HeaderContentTemplate>
<material:Card.SubHeaderContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"
Margin="16,0,16,14"
Style="{ThemeResource MaterialBody2}" />
</DataTemplate>
</material:Card.SubHeaderContentTemplate>
<material:Card.MediaContentTemplate>
<DataTemplate>
<Image Source="{Binding}"
Stretch="Uniform"
MaxHeight="194" />
</DataTemplate>
</material:Card.MediaContentTemplate>
</material:Card>
Great question!
Using the MediaContentTemplate, you should be able to place anything that you want in the DataTemplate, including PathIcons. Only thing is that the MediaContentTemplate will only be loaded if the MediaContent property is not null or an empty string. So I would do something like setting the the Path Data string to MediaContent and then use a Binding in the MediaContentTemplate to the PathIcon's Data property, like so:
<material:Card HeaderContent="Outlined card"
SubHeaderContent="With title and subtitle only"
MediaContent="PASTE PATH DATA HERE"
Style="{StaticResource MaterialOutlinedCardStyle}"
PointerExited="eventPageClick">
<controls:Card.MediaContentTemplate>
<DataTemplate>
<PathIcon Data="{Binding}"/>
</DataTemplate>
</controls:Card.MediaContentTemplate>
...
</material:Card>
Thank you sbilogan! You gave me the key to getting it working. They key was the text cant be empty for Media Content. It turns out I can put any text there and then add the Pathicon like below and that works. Thank you so much for your help!
<material:Card HeaderContent="Outlined card3"
SubHeaderContent="With title and subtitle only"
Style="{StaticResource MaterialOutlinedCardStyle}"
MediaContent="Example"
PointerExited="eventPageClick">
<material:Card.HeaderContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"
Margin="16,14,16,0"
Style="{ThemeResource MaterialHeadline6}" />
</DataTemplate>
</material:Card.HeaderContentTemplate>
<material:Card.SubHeaderContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"
Margin="16,0,16,14"
Style="{ThemeResource MaterialBody2}" />
</DataTemplate>
</material:Card.SubHeaderContentTemplate>
<material:Card.MediaContentTemplate>
<DataTemplate>
<PathIcon HorizontalAlignment="Center" VerticalAlignment="Center" Margin="10" Data="M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</DataTemplate>
</material:Card.MediaContentTemplate>
</material:Card>
I have a simple listbox that loads items (in my test case 135).
I logged all the ID's of the items that are loaded, and they all have a unique ID. The listbox datatemplate is a usercontrol, so in the usercontrol I also logged the ID's to see which ones are loaded.
Now is where it starts going wrong, it only loads about the first 10 items (I think whatever is initially visible), and then keeps repeating those first items over and over again. So instead of 135 unique objects, I have 135 objects that are one of the first 10 or so loaded.
You can see the logging here (there are a lot more ID's not visible):
After the User Control ID's line, that's the only ID's it loads and keeps looping those 10 ID's until there are 135 items in the listbox.
This is the full page code
<Style x:Key="ListBoxItemStyle1" TargetType="ListBoxItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Border x:Name="LayoutRoot" BorderThickness="3">
<ContentControl x:Name="ContentContainer"
VerticalContentAlignment="Top"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
Margin="{TemplateBinding Padding}"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
Foreground="{TemplateBinding Foreground}" />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<SearchBox x:Name="sbSearch" QuerySubmitted="sbSearch_QuerySubmitted" Margin="12,12,12,0"></SearchBox>
<ListBox x:Name="lbResults" Grid.Row="1" ItemContainerStyle="{StaticResource ListBoxItemStyle1}" Background="{x:Null}">
<ListBox.ItemTemplate>
<DataTemplate>
<userControls:WantlistItem Tag="{Binding}"></userControls:WantlistItem>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</Grid>
What am I doing wrong?
Edit1: Loading of listbox in main page
private void Page_Loaded(object sender, RoutedEventArgs e)
{
if(Variables.WantsAll == null) Helpers.GetWantList();
foreach (var v in Variables.WantsAll)
{
Debug.WriteLine(v.id);
}
Debug.WriteLine("--- USER CONTROL ID's ---");
lbResults.ItemsSource = Variables.WantsAll;
}
In the UserControl Page_Loaded I'm logging them as well.
In this screenshot you can see I scrolled down, and it starts repeating the same items again (sometimes it messes up, as you can see the first item is not correctly repeated, it's a different one).
Note that in front of the names I added the ID's it prints out, you can see it's repeating the same ID's (for example the green album: 1301162), even tho in the list I set as ItemsSource it only exists once (all items are unique).
The comment provided by Jay Zuo - MSFT provided the solution, the answer in this thread solved my problem exactly.
I've got a Flyout view with a TextBlock in it. The text block has more than one line's amount of text and I'd like it to wrap to the next line like it usually does, but when used in a Flyout it scrolls off the screen... How do you disable the scroll view in a Flyout?
Flyout XAML:
...
<AppBarButton.Flyout>
<Flyout Placement="Full">
<local:MyView/>
</Flyout>
</AppBarButton.Flyout>
...
My View XAML:
<UserControl ...>
<Grid>
...
<TextBlock Text="Loading..." Style="{ThemeResource SubtitleTextBlockStyle}" Margin="10,0,10,20" Grid.Row="1" TextWrapping="Wrap"/>
</Grid>
</UserControl>
It comes out like this:
To set properties of Flyout like width or scrollbar's visibility, we need to customize the style of FlyoutPresenter. Here is how I do it:
<Flyout Placement="Full" >
<Flyout.FlyoutPresenterStyle>
<Style TargetType="FlyoutPresenter">
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"></Setter>
</Style>
</Flyout.FlyoutPresenterStyle>
<Grid>
<TextBlock Text="This is an informational flyout. Click outside to dismiss.xxxjfdalisfsadpfuaspdfoia" Grid.Row="1" TextWrapping="Wrap"/>
</Grid>
</Flyout>
Directly copy the into your Flyout element will meet your requirement.
You can
1) make a maxwidth to your flyout
or
2) try this :
<Flyout Placement="full" >
<Grid ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
........
</Grid>
</Flyout>
best of luck !
Let say that we have the above xaml in wp7 platform:
<controls:Panorama x:Name="MainPanorama">
<controls:PanoramaItem x:Name="Panorama1" TabIndex="1">
<controls:PanoramaItem.Header>
<StackPanel Orientation="Vertical" Margin="12,70,0,-30">
<TextBlock x:Name="Header1" Text="Downloader" FontSize="50" Margin="-5,-70,0,0" />
</StackPanel>
</controls:PanoramaItem.Header>
///////////////////////////////
other xaml code like grids and other
</controls:PanoramaItem>
///////////////////////////////
other xaml code like PanoramaItems
</controls:Panorama>
How can i get the TextBlock.Text (string) of Header1, notice that i want something dynamically as i have many PanoramaItems and i want to get header of every PanoramaItem dynamically like an array of MainPanorama.
I have tried this:
PanoramaItem gen_panorama = MainPanorama.SelectedItem as PanoramaItem;
gen_panorama_head = Convert.ToString(gen_panorama.Header);
but there is no Header as the header is in template of every PanoramaItem, how can i get this?
I found the solution with 'Binding' header data template!
<controls:Panorama x:Name="MainPanorama">
<controls:Panorama.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical" Margin="12,70,0,-30">
TextBlock Text="{Binding}" FontSize="50" Margin="-12,-70,0,0" HorizontalAlignment="Left" Foreground="Black" />
</StackPanel>
</DataTemplate>
</controls:Panorama.HeaderTemplate>
<controls:PanoramaItem Header="Here any we want" x:Name="Panorama1" TabIndex="1">
</controls:PanoramaItem>
</controls:Panorama>