how to take value of tapped column/bar of winrt xaml column series chart using c# - winrt-xaml

how to take value of tapped column/bar of winrt xaml column series chart.
i want to open other chart using the value of each bar..
my code is:
<Charting:Chart x:Name="chart" Title="My Performance" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,0,0,0" Width="895" Height="548" Foreground="Black" FontSize="10" >
<Charting:ColumnSeries x:Name="mychart" Padding="10" BorderThickness="5" BorderBrush="#FF233083" Background="Yellow" IndependentValuePath="TestCode" DependentValuePath="Percentage" IsSelectionEnabled="True" Margin="0,0,0,4" Tapped="mychart_Tapped" >
i didn't get values from selecteditem thanks........

Related

Add a disabled/ non-selectable separator in a bound ComboBox

I have a ComboBox and I want to add a separator which is disabled, non-selectable.
Standard functions such as add, edit, delete should be selectable under the separator.
The items containing an image and text should be displayed above the separator.
<ComboBox Name="cmbTest">
<!--These items should be loaded by code or ViewModel.-->
<ComboBoxItem >Item1</ComboBoxItem>
<ComboBoxItem >Item2</ComboBoxItem>
<ComboBoxItem >Item3</ComboBoxItem>
<!--Separator which is disabled.-->
<ComboBoxItem IsEnabled="False" >
<NavigationViewItemSeparator BorderThickness="1"></NavigationViewItemSeparator>
</ComboBoxItem>
<!--Menu below the separator.-->
<ComboBoxItem x:Name="cmbiNewApplication">Neu</ComboBoxItem>
<ComboBoxItem x:Name="cmbiEdit">Bearbeiten</ComboBoxItem>
<ComboBoxItem x:Name="cmbiDelete">Löschen</ComboBoxItem>
<ComboBoxItem x:Name="cmbiImportApplication">Import</ComboBoxItem>
<ComboBoxItem x:Name="cmbiExportApplication" >Export</ComboBoxItem>
</ComboBox>
Currently, my ComboBox is tied to a ViewModel and I've created a TemplateSelector on advice. Unfortunately, the ComboBoxItem in the template doesn't seem to be the generated ComboBoxItem itself, so the IsEnabled property has no effect.
<ComboBox x:Name="cmbApplication"
CornerRadius="3"
Width="300"
ItemsSource="{x:Bind AppProcessMainViewModel.AppProcesses}"
Tapped="cmbApplication_Tapped" >
<ComboBox.ItemTemplateSelector>
<local:MenuDataTemplateSelector>
<local:MenuDataTemplateSelector.DefaultTemplate>
<DataTemplate x:DataType="local:AppProcess" >
<StackPanel Orientation="Horizontal">
<StackPanel Orientation="Horizontal" Opacity="{x:Bind BoolToOpacity(Activated), Mode=OneWay}">
<TextBlock Text="{x:Bind Description, Mode=OneWay}"></TextBlock>
</StackPanel>
</StackPanel>
</DataTemplate>
</local:MenuDataTemplateSelector.DefaultTemplate>
<local:MenuDataTemplateSelector.MenuTemplate>
<DataTemplate x:DataType="local:AppProcess">
<ComboBoxItem IsEnabled="False" Height="22" >
<NavigationViewItemSeparator BorderThickness="1"></NavigationViewItemSeparator>
</ComboBoxItem>
</DataTemplate>
</local:MenuDataTemplateSelector.MenuTemplate>
</local:MenuDataTemplateSelector>
</ComboBox.ItemTemplateSelector>
</ComboBox>
My consideration was that I set the IsEnabled property of the item in the Tapped event of the combo box.
Unfortunately, I really can't figure out how to get the property of the ComboBoxItem by index.
How can I set the property?
Is this really the best approach (TemplateSelector and setting the property in the Tapped event)?
I've already read a lot about this and unfortunately there seems to be a lot missing in WinUI 3 in contrast to UWP/WPF that make things much easier.
I'm trying to get the item via the index and cast it, but there seems to be another problem, maybe because of the ViewModel?
Something like...
//Error
auto cb = cmbApplication().Items().GetAt(1).as<winrt::Microsoft::UI::Xaml::Controls::ComboBoxItem>();
I came across this site of the MS documentation (Find DataTemplate Generated Elements) and just tried it out, which works wonderfully... happy new year!
auto item = cmbApplication().ItemContainerGenerator().ContainerFromItem(cmbApplication().Items().GetAt(3));
item.as< winrt::Microsoft::UI::Xaml::Controls::ComboBoxItem>().IsEnabled(false);

Make a Border Appear on only the Last Row of a Tablix in Visual Studio

I have a Tablix table object that is grouped by column invoiceNumber. The number of rows in the table is not static. I want a bottom border only on the very last row of the table (so no borders between the middle rows.)
On the last cell I have a custom function in the Border property:
=IIF(ROWNUMBER("invoiceNumber") = COUNT(Fields!invoiceTotal.Value, "invoiceNumber"), "Solid", "None")
<TablixCell>
<CellContents>
<Textbox Name="Textbox41">
<CanGrow>true</CanGrow>
<KeepTogether>true</KeepTogether>
<Paragraphs>
<Paragraph>
<TextRuns>
<TextRun>
<Value>=Fields!invoiceTotal.Value</Value>
<Style />
</TextRun>
</TextRuns>
<Style />
</Paragraph>
</Paragraphs>
<rd:DefaultName>Textbox10</rd:DefaultName>
<Style>
<Border>
<Color>LightGrey</Color>
<Style>=IIF(ROWNUMBER("invoiceNumber") = COUNT(Fields!invoiceTotal.Value, "invoiceNumber"), "Solid", "None")</Style>
</Border>
<TopBorder>
<Style>None</Style>
</TopBorder>
<BottomBorder>
<Style>None</Style>
</BottomBorder>
<PaddingLeft>2pt</PaddingLeft>
<PaddingRight>2pt</PaddingRight>
<PaddingTop>2pt</PaddingTop>
<PaddingBottom>2pt</PaddingBottom>
</Style>
</Textbox>
<rd:Selected>true</rd:Selected>
</CellContents>
</TablixCell>
</TablixCells>
But the system still puts a border under every cell. Should I place the function somewhere else?
Thank you!

Windows 10 Universal app flyout, how to remove scrollbars?

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 !

Header template and title

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>

How do specify a width percentage in JavaFX 2 using FXML?

I am looking for a way to say set a maxWidth size to 80% in FXML.
Much like in web development.
<VBox fx:id="testVB" prefWidth="600">
But this does not:
<VBox fx:id="testVB" prefWidth="80%">
I know that in Straight JavaFX2 non-fxml you can create insets? What is the best way to do this outside of code in FMXL?
Thanks!
Riley
I'm not sure you can. You need to use the GridPane layout component. In this component, you can specify rows and columns constraints, and in these constraints you can specify a width as a percentage. For example:
<GridPane>
<children>
<TitledPane text="testGridPane" GridPane.columnIndex="0" GridPane.rowIndex="0" />
</children>
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" percentWidth="80.0" prefWidth="100.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" percentWidth="20.0" prefWidth="100.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
</rowConstraints>
</GridPane>
This code defines a GridPane with a first column with a width of 80%. The TitledPane is set in the first cell of the first column of this GridPane, and can (because you need to be sure that the width constraints of the TitledPane match your needs) occupy 80% of the width of the GridPane.
Please note that I removed all information not relevant to your question. By the way, Oracle's Scene Builder tool is very useful to define complex FXML layout.
It seems like many answers have already been provided and they should work. However, there is a way to set percentages:
<fx:define>
<Screen fx:factory="getPrimary" fx:id="screen" />
</fx:define>
This would help you detect the dimensions of the current screen, the application is being displayed on. Now that we have the display dimensions, we can play with it in FXML as follows:
<HBox fx:id="hroot" prefHeight="${screen.visualBounds.height}" prefWidth="${screen.visualBounds.width}"> Your FXML elements inside the root... </HBox>
Note that I use visualBounds, since this would get me the available space on the screen, since I don't want an overlap with the taskbar in Windows for example. For fullscreen applications, you would just use 'bounds'.
Now, to come to your point of using percentages, you can actually play with the value of the prefheight and prefWidth. You can put calculations inside the ${}.
Optionally:
If you want to have all your elements use relative sizes, just refer to them, using their ID and width or height property, and make your calculation.
<VBox fx:id="VBSidebar" prefWidth="${hroot.width*0.15}" prefHeight="${hroot.height}"> more elements.. </VBox>
Hope this helps!
You can simulate it - basic example that simulates 50% for two cols in an HBox. You can add dummy panes to get thirds, etc.
HBox {
VBox {
static hgrow : "ALWAYS",
Label {
text : "Privacy",
alignment : "CENTER",
styleClass : ["h2", "heading"]
}
},
VBox {
static hgrow : "ALWAYS",
Label {
text : "Messages",
alignment : "CENTER",
styleClass : ["h2", "heading"]
},
Label {text:""}
}
}

Resources