1

4x LineSeries のチャートがあります。線を表すために 2 つの異なるスタイルを定義しました。特定の LineSeries に適用されるスタイルを動的に変更できるようにしたいと考えています (たとえば、ユーザーがボタンをタップするなどに基づいて)。

c# からスタイルを更新する方法がわかりません。どんな助けでも大歓迎です!

私が試してみました:

lineChartMood.PolylineStyle = this.Resources.PolylineStyle2 as Style;

しかし、これは Null 例外を返します。

スタイル定義を含むページの XAML は次のとおりです。

    <phone:PhoneApplicationPage 
    x:Class="Bhutaan.ChartingTest"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:charting="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"
    xmlns:local="clr-namespace:Bhutaan"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"
    shell:SystemTray.IsVisible="True">

    <phone:PhoneApplicationPage.Resources>
        <Style x:Key="PolylineStyle" TargetType="Polyline">
            <Setter Property="StrokeThickness" Value="5"/>
        </Style>
        <Style x:Key="PolylineStyle2" TargetType="Polyline">
            <Setter Property="StrokeThickness" Value="1"/>
        </Style>
    </phone:PhoneApplicationPage.Resources>


    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--TitlePanel contains the name of the application and page title-->
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock x:Name="ApplicationTitle" Text="TEST" Style="{StaticResource PhoneTextNormalStyle}"/>
            <TextBlock x:Name="PageTitle" Text="added" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

        <!--ContentPanel - place additional content here-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,-0,12,0">
            <ScrollViewer>
                <StackPanel>
                    <TextBlock Text="Great! That's been saved." FontSize="30" Margin="0,0,0,0"/>
                    <!-- Chart  -->
                    <charting:Chart
                        x:Name="myChart"
                        Margin="0,20,0,0"
                        Height="350"
                        Style="{StaticResource PhoneChartStyle}"
                        Template="{StaticResource PhoneChartPortraitTemplate}">

                        <!-- Series -->
                        <charting:LineSeries
                            x:Name="lineChartMood"
                            Title="Mood"
                            ItemsSource="{Binding}"
                            DependentValuePath="MoodValue"
                            IndependentValuePath="Timestamp"
                            PolylineStyle="{StaticResource PolylineStyle}" >

                            <charting:LineSeries.LegendItemStyle>
                                <Style TargetType="charting:LegendItem">
                                    <Setter Property="Margin" Value="5 0 5 0"/>
                                </Style>
                            </charting:LineSeries.LegendItemStyle>
                        </charting:LineSeries>
                        <!-- Series -->
                        <charting:LineSeries
                            Title="Energy"
                            ItemsSource="{Binding}"
                            DependentValuePath="EnergyValue"
                            IndependentValuePath="Timestamp">
                            <charting:LineSeries.LegendItemStyle>
                                <Style TargetType="charting:LegendItem">
                                    <Setter Property="Margin" Value="5 0 5 0"/>
                                </Style>
                            </charting:LineSeries.LegendItemStyle>
                        </charting:LineSeries>
                        <!-- Series -->
                        <charting:LineSeries
                            Title="Mental"
                            ItemsSource="{Binding}"
                            DependentValuePath="MentalValue"
                            IndependentValuePath="Timestamp">
                            <charting:LineSeries.LegendItemStyle>
                                <Style TargetType="charting:LegendItem">
                                    <Setter Property="Margin" Value="5 0 5 0"/>
                                </Style>
                            </charting:LineSeries.LegendItemStyle>
                        </charting:LineSeries>
                        <!-- Series -->
                        <charting:LineSeries
                            Title="Hunger"
                            ItemsSource="{Binding}"
                            DependentValuePath="HungerValue"
                            IndependentValuePath="Timestamp">
                            <charting:LineSeries.LegendItemStyle>
                                <Style TargetType="charting:LegendItem">
                                    <Setter Property="Margin" Value="5 0 5 0"/>
                                </Style>
                            </charting:LineSeries.LegendItemStyle>
                        </charting:LineSeries>
                    </charting:Chart>

                </StackPanel>
            </ScrollViewer>
        </Grid>
    </Grid>


</phone:PhoneApplicationPage>
4

3 に答える 3

5

私はあなたのコードをテストし、問題の原因を見つけました。

this.lineChartMood不明な理由でフィールドがアプリケーションによって設定されていないため、NullReferenceExceptionが発生します。

このラインシリーズオブジェクトは自分で入手する必要があります。それを取得するための2つの可能な方法があります:

var lineSeriesWay1 = this.FindName("lineChartMood");
var lineSeriesWay2 = myChart.Series.OfType<LineSeries>().First(ls => ls.Name == "lineChartMood");

ただし、次this.lineSeriesMoodのように、コンストラクターでフィールドを明示的に設定することをお勧めします。

public partial class MainPage : PhoneApplicationPage
{
    // Constructor
    public MainPage()
    {
        InitializeComponent();
        // because the code 'this.FindName("lineChartMood")' doesn't work in the constructor, I'll use the following line:
        this.lineChartMood = this.myChart.Series.OfType<LineSeries>().First(ls => ls.Name == "lineChartMood");

        // other code
    }


    private void Button_Click(object sender, RoutedEventArgs e)
    {
        this.lineChartMood.PolylineStyle = (Style)this.Resources["PolylineStyle2"];
        this.lineChartMood.Refresh(); // you should call this method so that the style is applied
    }
}

そうすれば、例外なくシリーズを参照できるようになります。

于 2012-08-27T09:50:08.937 に答える
3

リソースを App.xaml に追加し、App.Current.Resources を使用してそれらを参照してみませんか?? これは、プログラムが特定のページで定義されたローカル リソースを参照できない可能性があるためです。私は間違っているかもしれません。これは解決策ではなく、単なる回避策です。

于 2012-08-26T09:07:21.863 に答える
2

lineChartMood.PolylineStyle = this.Resources.PolylineStyle2 as Style; する必要があります lineChartMood.PolylineStyle = this.Resources["PolylineStyle2"] as Style;か??

于 2012-08-26T08:07:11.817 に答える