How can i change the color of Gridlines of Extended WPF propertygrid - propertygrid

I am using WPF extended Propertygrid i have change the background color of propertygrid but i am unable to change the color of gridlines and the white are of propertygrid. please see the image at the below mentioned link.
https://dl.dropboxusercontent.com/u/5865812/image1.png
Thanks,

Not an easy one. There is no easy "Style" property to configure the ItemsControl inside the PropertyGrid. You can copy the entire template of the PropertyGrid from the source and modify it.
You should ask for a feature request on the issue tracker on codeplex.
In the meantime, the way I found is by creating your own subclass of PropertyGrid, and force a GroupStyle in the underlying template part:
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
PropertyItemsControl control = ( PropertyItemsControl )this.GetTemplateChild( "PART_PropertyItemsControl" );
var s = ( GroupStyle )this.Resources[ "groupStyle" ];
control.GroupStyle.RemoveAt( 0 );
control.GroupStyle.Add( s );
}
And in your xaml:
<local:MyPropertyGrid >
<local:MyPropertyGrid.Resources>
<GroupStyle x:Key="groupStyle">
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Border>
<Expander Header="{Binding Name}"
IsExpanded="True"
Background="Green">
<ItemsPresenter />
</Expander>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</GroupStyle.ContainerStyle>
</GroupStyle>
</local:MyPropertyGrid.Resources>
</local:MyPropertyGrid >

Related

What type of property work on VisualState.Setters (Targeting different devices from a Universal Windows App)

I have problem, I create my own Usercontrol and I create some property and use the original property such as FontSize property and so on.
When I want to use this property for targeting different devices from a Universal Windows App via Blend I've got errors and I can't gain access to original property to set VisualState.Setters.
This error message when i set value for visualstate :
the property value is not valid
I you don't understand you can see my codes :
private int _fontSize;
/// <summary>
/// Set font size for text caption
/// </summary>
public new int FontSize
{
get { return _fontSize; }
set
{
_fontSize = value;
TxtCaption.FontSize = _fontSize;
}
}
this code is one of my property I use for set font size to my textblock object.
when I want to set font size when windows 10 app size change automatically textblock font size change but I,ve got error and I can't set to my own property
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="VisualStateGroupDevices">
<VisualStateGroup.Transitions>
<VisualTransition GeneratedDuration="0"/>
</VisualStateGroup.Transitions>
<VisualState x:Name="Phone5in">
<VisualState.Setters>
<Setter Target="BtnInbox.(FrameworkElement.FlowDirection)" Value="LeftToRight"/>
<Setter Target="BtnInbox.(Control.FontSize)" Value="20"/>
</VisualState.Setters>
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowHeight="640" MinWindowWidth="360" />
</VisualState.StateTriggers>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
https://msdn.microsoft.com/en-us/library/windows/apps/mt210475.aspx
this code never set on XAML
<Setter Target="BtnInbox.(Control.FontSize)" Value="20"/>
please help me what type of property I have to use to work.
thanks by
Hussein Habibi Juybari

Alloy require could not find module

Problem: Trying out a simple demo for a custom tabgroup in Titanium Alloy. However, the compiler keeps failing with the message Could not find module: common. What I thought would be a straightforward test is anything but.
Titanium SDK: 3.1.3.GA
OS: iOS 7.x
controllers/index.js
var common = require('common');
function tabGroupClicked(e) {
common.tabGroupClicked(e);
}
Alloy.Globals.parent = $;
Alloy.Globals.tabGroup = $.tabGroup;
Alloy.Globals.selectedTab = $.tab1;
$.index.open();
controllers/common.js
exports.tabGroupClicked = function(e){
if (Alloy.Globals.selectedTab !== e.source){
// reset the selected tab
Alloy.Globals.previousTab = Alloy.Globals.selectedTab;
Alloy.Globals.selectedTab = e.source;
// change the selected flag
Alloy.Globals.previousTab.selected = false;
Alloy.Globals.selectedTab.selected = true;
// change the background image
Alloy.Globals.previousTab.backgroundImage = Alloy.Globals.previousTab.disabledImage;
Alloy.Globals.selectedTab.backgroundImage = Alloy.Globals.selectedTab.selectedImage;
// swapping the zindexes of the childTabs
Alloy.Globals.parent.getView(Alloy.Globals.previousTab.childTab).getView().zIndex=2;
Alloy.Globals.parent.getView(Alloy.Globals.selectedTab.childTab).getView().zIndex=3;
}
};
index.xml
<Alloy>
<Window id="index" class="container">
<View id="tabGroupWindow" zIndex="0" class="container">
<Require src="tabThreeView" id="tabThreeView"/>
<Require src="tabTwoView" id="tabTwoView"/>
<Require src="tabOneView" id="tabOneView" />
</View>
<!-- Custom tab group -->
<View id="tabGroup">
<View id="tab1" onClick="tabGroupClicked"></View>
<View id="tab2" onClick="tabGroupClicked"></View>
<View id="tab3" onClick="tabGroupClicked"></View>
</View>
</Window>
</Alloy>
Can anyone see anything that I'm obviously overlooking? I've cleaned the project, restarted Studio, scoured forums for any reference to this issue. Not finding a reference usually means I forgot some basic detail.
Your help is appreciated.
To use the require function, you have to create a service.
So the common.js module as you nammed it, has to be under this folder : app/lib. If it's not in the lib folder, it will not be recognized, and it will not be required.
You can find more help in this page.

WinRT Event Handling from DataTemplate

I have a DataTemplate which requires an event handler for one of the objects. This DataTemplate is contained in a ResourceDictionary. What is the best way to add an event handler to this template?
I tried defining the event handler in app.xaml.cs but the handler isn't executing. Creating a code behind file for the ResourceDictionary leads to load errors during app start up in MergedDictionaries.
from GraphStyles.xaml
<DataTemplate x:Key="PieTemplate">
<Grid HorizontalAlignment="Left" Width="350" Height="350" >
<Border>
<Charting:Chart
x:Name="PieChart"
Title="Play Attempts"
Margin="70,0" Loaded="PieChart_Loaded">
<Charting:Chart.Series>
<Charting:PieSeries
Title="Attempts"
ItemsSource="{Binding Items}"
IndependentValueBinding="{Binding Name}"
DependentValueBinding="{Binding Value}"
IsSelectionEnabled="True" />
</Charting:Chart.Series>
</Charting:Chart>
</Border>
</Grid>
</DataTemplate>
in App.Xaml.cs
private void PieChart_Loaded(object sender, RoutedEventArgs e)
{
var pieChart = sender as Chart;
var legendItems = ((PieSeries)pieChart.Series[0]).LegendItems;
foreach (LegendItem item in legendItems)
{
pieChart.LegendItems.Add(item);
pieChart.LegendStyle = item.Style;
}
}
Option 1
As far as I am aware you will have to reference the datatemplate in the page/usercontrol's Resources at the top. Use a merged dictionary so you can still utilize the graphstyles.xaml.
If you are uncomfortable as this breaks your convention, there is a rather long winded alternative:
Option 2
Use an MVVM Viewmodel and set the page/usercontrols DataContext.
Keep the datatemplate in the graphstyles.xaml and use an Attached Behavior to hook the Loaded event, passing the event trigger up to the viewmodels command.
Create an event in the ViewModel that the UI can respond to, then hook onto that and handle in the Views codebehind as you have done.
I must say I'm not mad on Option 2 as it kind of breaks some view/VM seperation but it should get the job done - note that you will have to pass the chart as an object through from the attached behavior, to the viewmodel then back to the view against before you cast it back to a Chart.

How to get a view based on coordinate in openlaszlo?

In JavaScript we have document.elementfrompoint to get an element based on coordinates.
Is there any thing like that in Openlaszlo to get a view based on coordinate?
There is no direct support for that functionality in OpenLaszlo, but for ActionScript 3 based runtimes you can utilize the flash.display.DisplayObjectContainer#getObjectsUnderPoint() method. In the DHTML runtime, you can use the document.elementFromPoint(x, y), and based on Quirksmode that should be supported by all modern browsers.
Here is an example program implementing an canvas.elementFromPoint() method:
<canvas debug="true">
<passthrough when="$as3">
import flash.geom.Point;
</passthrough>
<view id="background" width="100%" height="100%" bgcolor="#eeeeee" clickable="true"/>
<view id="red" x="200" y="100" width="200" height="200" bgcolor="#ff0000" opacity="0.3" clickable="true" />
<view id="green" x="150" y="200" width="200" height="200" bgcolor="#00ff00" opacity="0.3" clickable="true"/>
<view id="blue" x="250" y="200" width="200" height="200" bgcolor="#0000ff" opacity="0.3" clickable="true"/>
<handler name="onclick" reference="lz.GlobalMouse">
canvas.elementFromPoint();
</handler>
<method name="elementFromPoint"><![CDATA[
var mouseX = canvas.getMouse('x'),
mouseY = canvas.getMouse('y'),
objects = null, // array of objects at mouse pointer in SWF runtime
element = null; // The element we are looking for
Debug.info( 'mouse position: x=' + mouseX + ' / mouseY=' + mouseY );
if ($as3) {
// in SWF runtime, use the DisplayObjectContainer.getObjectsUnderPoint() method
objects = canvas.getDisplayObject().getObjectsUnderPoint(new Point(mouseX, mouseY));
element = objects[objects.length-1].owner;
} else {
// in DHTML, we can use elementFromPoint, and need to retrieve the owner view of the div
element = document.elementFromPoint(mouseX, mouseY).owner.owner;
}
Debug.info('View under mousecursor:', element);
return element;
]]></method>
</canvas>
There are 4 views, one background view scaled to 100% x 100%. And three color views: red, green and blue - with the blue one being the top one. When clicking on the view, the correct view object is returned.
The code has been tested in the DHTML runtime with Chrome 22.0, Firefox 16.0.1, and Opera 12.02. Flash should work in every browser, I haven't tested with IE.
I don't think so.
You will have to build your own custom array or observer object, collect all views and then loop through all items and do a check if the coordinates are inside the bounding box of the view.
In Flash there is also something like "hitTest", that might be similar to JavaScript's "document.elementfrompoint" to get the exact pixel matching, in case the bounding box is not enough for you.
Sebastian

WPF link button

I have a button control to which I want add image as well as hyperlink property, i.e it should be an image button with link to other source. I tried
<Button Click="OnNavigationRequest" ToolTip="Orkut">
<Image Source="C:\Documents and Settings\SaurabhS\My Documents\Visual Studio 2008 \Projects\SaurabhSinhaDemos\WPF_Zone\AddressBook\AddressBook\images\orkut.jpeg"/>
<Hyperlink NavigateUri="http://www.orkut.com">Orkut</Hyperlink>
</Button>
and in code behind:
AddHandler(Hyperlink.RequestNavigateEvent,
new RoutedEventHandler(OnNavigationRequest));
public void OnNavigationRequest(object sender, RoutedEventArgs e)
{
var source = e.OriginalSource as Hyperlink;
if (source != null)
Process.Start(source.NavigateUri.ToString());
}
But got the following error:
content set more than once...
How should I do it?
In your code, the Button element contains two child elements. The Button element can only take one child element.
Wrap Image and Hyperlink in a StackPanel or some other layout container and the error will go away (see Int3's answer for an example).
Try following
<Button>
<StackPanel Orientation="Horizantal">
<Image Source="path to the image"/>
<Hyperlink NavigateUri="http://www.orkut.com"/>
</StackPanel>
</Button>

Resources