We Keep Coding

Increase Chart Size of WPF Chartingtoolkit

Im currently working on a little Project, where i make use of the WPF Charting Toolkit.
now im a bit annoyed by these huge margin
<ch:Chart Grid.Row="1" x:Name="Chart">
<ch:Chart.LegendStyle>
<Style TargetType="{x:Type vt:Legend}">
<Setter Property="Width" Value="0"/>
<Setter Property="Height" Value="0"/>
</Style>
</ch:Chart.LegendStyle>
<ch:LineSeries ItemsSource="{Binding WeightChartData, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" DependentValuePath="Value" IndependentValuePath="Key" />
<ch:Chart.Axes>
<ch:LinearAxis Minimum="{Binding MinVal}" Maximum="{Binding MaxVal}" Orientation="Y"/>
</ch:Chart.Axes>
</ch:Chart>
this is the XAML from the chart.
is there any way i can make the Chart bigger

In order to make the margins more comfortable, you have to create a new style for the Chart. Easiest way is to copy the original Chart style completely and modify it to meet your needs.
The original style is available from GitHub. From that file you can find Style TargetType="charting:Chart", where the large margins are defined. For example:
<Setter Property="LegendStyle">
<Setter.Value>
<Style TargetType="datavis:Legend">
<Setter Property="Margin" Value="15,0,15,0" />
Alternatively, you can check the following SO post for a "bare minimum" chart style and to modify it for your needs: Change margin around plot area and title in WPF Toolkit chart

Can binding be used in XAML within a Style?

I wrote a sample to see if binding could be used within a Style in a blank Windows Store app - it compiled but did not work exactly as I'd hoped. I'm relatively new to XAML and binding so may have missed something.
In the sample below there are two rectangles, both bound to the slider control and both should change at the same time as the slider is moved, but it seems that only the first one changes; the first one is bound directly, the second is bound via a style.
Is binding in a Style supposed to be possible in a Win Store app?
(My aim is to have a slider that changes the settings on a large number of elements at once, it seemed like this would be a better approach than copy/pasting bindings to all of them)
<Grid Background="#FF87873D">
<StackPanel>
<StackPanel.Resources>
<Style x:Key="myTestRectangleStyle" TargetType="Rectangle">
<Setter Property="Fill" Value="DarkBlue" />
<Setter Property="Margin" Value="10,10" />
<Setter Property="Height" Value="30" />
<Setter Property="Width" Value="{Binding ElementName=slider1, Path=Value}" />
</Style>
</StackPanel.Resources>
<Rectangle Width="{Binding ElementName=slider1, Path=Value}" Fill="Black" Margin="10,10" Height="30"/>
<Rectangle Style="{StaticResource myTestRectangleStyle}"/>
<Slider Name="slider1" Minimum="20" Maximum="200" Margin="20,0"/>
</StackPanel>
</Grid>

Answering my own question...it seems this isn't possible on a Windows Store App.
I had a clarification from a user on a MSDN forum that
[Bindings] are not supported on Style setters in Windows Store Apps like
they are in WPF, i.e. you cannot bind to the Value property of the
Slider in the Style
So the workaround is just to set the binding directly outside of the Style (a long winded option if you have a lot of elements to bind unfortunately)

How can I create an adaptive layout in WPF?

A website can be designed to adapt to smaller screen sizes using media queries. For example, three columns on a wide screen, one column on a low-resolution phone.
Is there a similar technique for WPF to adjust the layout based on available screen space or parent control size?
For example, I'd like to have 3 columns displayed horizontally on a large screen, but displayed vertically on smaller screen. Ideally, I'd like to formulate layouts like this: "If this control's width is less than 400 points, rearrange these controls in that way."
How can I create an adaptive design like this in WPF? That is, define different layouts for controls for specific parent control sizes?
Ideally controls should be rearranged instead of duplicated or recreated, to avoid being extremely slow.

The easiest way to do this is with DataTriggers and a Converter to test if the bound value is greater or less than a parameter.
This will allow you to easily adjust the style setters based on a bound value. For example, you could use
<Style x:Key="MyControlStyle">
<!-- Default Values -->
<Setter Property="Grid.Row" Value="0" />
<Setter Property="Grid.Column" Value="0" />
<Style.Triggers>
<DataTrigger Value="True"
Binding="{Binding ActualHeight, ElementName=MyWindow,
Converter={StaticResource IsValueLessThanParameter},
ConverterParameter=400}">
<!-- Values to use when Trigger condition is met -->
<Setter Property="Grid.Row" Value="1" />
<Setter Property="Grid.Column" Value="1" />
</DataTrigger>
</Style.Triggers>
</Style>
In the case where you have a more complex layout with many pieces that change based on some triggered value, you can replace entire Templates with your trigger instead of just individual properties
<Style x:Key="MyContentControlStyle" TargetType="{x:Type ContentControl}">
<Setter Property="ContentTemplate" Value="{StaticResource BigTemplate}" />
<Style.Triggers>
<DataTrigger Value="True"
Binding="{Binding ActualHeight, ElementName=MyWindow,
Converter={StaticResource IsValueLessThanParameter},
ConverterParameter=400}">
<Setter Property="ContentTemplate" Value="{StaticResource LittleTemplate}" />
</DataTrigger>
</Style.Triggers>
</Style>
I believe you can also bind to the SystemParameters object to use additional information about the application in your bindings, although I can't remember the exact syntax for it right now.

If you're using the UWP flavour of WPF, then you might use AdaptiveTrigger:
<AdaptiveTrigger MinWindowWidth="720" MinWindowHeight="900" />

The only way I know to do something like this is in code, and you'll need to create a custom layout. The simplest way of doing that is to create a new class that inherits from Panel, and implement MeasureOverride and ArrangeOverride. I've done custom layouts before, and they can end up being a rather large pain to get working for all cases. If you Google "wpf custom layout" you'll get some good examples to start with. Given all the functionality you want, you'll definitely have your work cut out for you. You'll probably want to look at attached properties to see about putting annotations in the xaml to give your code an idea of what should be included at the different sizes.

Is it possible to put Button in WPF slider thumb?

Is it possible to put Button in WPF slider thumb? Not custom thumb itself but simply add button on it?

I'm not sure how you would put a button in it without customizing the Thumb. If you're interested in customization:
It looks like this sample customizes the Thumb as well as the rest of the slider.
<Style x:Key="CustomThumbForSlider" TargetType="{x:Type Thumb}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Ellipse Fill="#FF8F4040" Stroke="#FF000000" Height="15" Width="15"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Having never personally done this, my guess would be that you just replace the following portion with the control template you're using:
<Ellipse Fill="#FF8F4040" Stroke="#FF000000" Height="15" Width="15"/>
EDIT: Unless you explicitly need the functionality of a button, you should probably use something like a TextBlock to display your value.

I'm not sure I understand the question, but : the whole interest of WPF is the ability to customize each element with ControlTemplates. Here is an article from Josh Smith explaining it : Understanding Templates in WPF and here a tutorial on customizing sliders : Custom sliders.
Edit: forgot to put the link title. My bad.

using Global Light in Wpf

I am developing UI for a Wpf application. I have designs build by designer in Adobe Photoshop CS3. I am going through them and achieving the same in my project using WPF. In PhotoShop, while setting Drop Shadow, there is option to select Angle and there is a CheckBox for
Use Global Light.
I got some reference for this. but I don't know how to achieve this in WPF. In WPF, I am not able to find any such option with DropShadowEffect. Anybody help me plz.

I don't believe there is any similar concept for a drop shadow effect. That being said, you could use style so create your own GlobalLight style that would be used by your controls.
For example:
<Grid>
<Grid.Resources>
<Style x:Key="GlobalLight" TargetType="TextBlock">
<Setter Property="Effect">
<Setter.Value>
<DropShadowEffect BlurRadius="2" Direction="-90" Color="Black" ShadowDepth="1"/>
</Setter.Value>
</Setter>
</Style>
</Grid.Resources>
<TextBlock Text="Drop shadow effect text" Style="{StaticResource GlobalLight}" />
</Grid>
More examples of using the drop shadow effect can be found here.