wpf tabitem header context menu - tabcontrol

How do I add a context menu to wpf tabitem that only appears when I click on tabitem header and not the content?
I also need to create tabitems dynamically in .cs so doing this statically in .xaml won't work.
I've tried adding context menu to tabitem.header but it has some problems where if I have
[tabitem 1][tabitem2 ]
[tabitemtabitemtabitemta]
[tabitem2 ] is stretched to match the width of tabcontrol.
any help would be appreciated.
Thanks!

See this question for how to do it programmatically. The trick is to set the ContextMenu on whatever control you set as the header content. If you're just using the header to set a simple string value, that won't work. At minimum you'll need to create a TextBlock or ContentControl or something.
For those interested in how to do it via XAML (particularly when using MVVM pattern):
Set a ContextMenu on the TabControl's ItemContainerStyle. It will then only apply to actual tab part (the header) and not the tab content. You can use bindings and such on the MenuItems to get varied behavior based on the specific tab, provided your tab is using a ViewModel..
<TabControl>
<TabControl.ItemContainerStyle>
<Style TargetType="{x:Type TabItem}">
<Setter Property="ContextMenu">
<Setter.Value>
<ContextMenu/> <!-- Define it here! -->
</Setter.Value>
</Setter>
</Style>
</TabControl.ItemContainerStyle>
</TabControl>

Related

How do I change the color of the semanticpage footer?

I added Footer to my page, but I want to change its color. how do i do this?
...
...
</semantic:content>
<semantic:footerCustomActions>
<Button icon='sap-icon://save' text="Kaydet" type="Emphasized" press="onEdit"/>
</semantic:footerCustomActions>
</semantic:SemanticPage>
</mvc:View>
The Semantic classes follow strict design rules. As said in the official documentation, buttons in this aggregation have their type set to Transparent.
Internally, the type you provide is ignored.
What you might do:
Don’t use a semantic page (generally easier)
Extend the semantic page class you are using and overwrite the method that generates the custom actions on the footer
What you might do:
sap theme designer for all app (semanticpage footer)
custom css with !important (add id or class for semantic:footerCustomActions)

Adding icons to an button in gwt

i have button and want to set an icon to it along with the text inside it. their is no property to add icon to button like in smartGwt .. any idea how to achieve it please help.
There are many ways of achieving this.
Way 1 : Easy way
Just set the background image via code.
myButton.getElement().getStyle().setBackgroundImage("path");
Way 2: Another easy way
Set your own html
myButton.setHtml("Pass the html string");
Way 3: Easy but gives more control
myButton.addStylename("buttonStyle")
Use css to style this
.buttonStyle{
color : red;
}
Way 4: Best way according to me
Create your own split button wrapping it around a flowpanel or horizontalPanel, with image as your first widget and button as your another widget. This gives you additional control on image and as well as button. You can have your click handler on image as well as button and you can style each one of them individually.
This is how I achieved setting an icon in my get:button.
Add an extra style class hook, mine below is btn-fa-group to your gwt button. If you use the attribute 'addStyleNames' you can define them in your stylesheet and have multiple classes.
<g:Button text=" Post Your Answer" enabled="false" ui:field="showPostButton" addStyleNames="btn btn-default btn-fa-group" />
Now in your CSS define the following declaration:
btn-fa-group:before {
color: #333333;
content: "\f0c0";
display: inline-block;
font-family: "fontawesome";
}
Some important things to note; don't forget the before selector, make sure the unicode starts with a slash and have fontAwesome installed. Alternatively you can use another glyph icon if you have the font installed.
You can set innerhtml with image in button i.e.
Button button=new Button("<image src='abc.jpg' width='200px' height='300px' />Ok");
Button bt = new Button();
bt.getElement().getStyle().setBackgroundImage("url('path/to/ur/image/imagename.extention')");
also set size of background image wrt to the size of button
bt.getElement().getStyle().setProperty("backgroundSize","30px");
Add a Css Class to your Button is probalby the best solution.
button.addStyleName("ButtonIcon");
How to define the CSS and HTML you can read here.
Yes ,you can .Gwt have a SmartGwt type button called push buttopn
com.google.gwt.user.client.ui.PushButton
You can pass Image object to it as below
Image image = new Image(GWT.getModuleBaseURL() + "/images/search-arrow.png");
RootPanel.get().add(new PushButton(image));

How to get handle of controls in ViewModel (MVVM)

I am new to MVVM and need help on below scenario.
I have a Stack panel added on my view, now I have to add few controls dynamically to this stack panel through viewmodel. For this I need a handle of stack panel in my viewmodel. Can anybody please guide me how I can access stack panel in my viewmodel.
I read in other bloges that it can be done by using Dependency property. but still I am not able to find way to solve this issue.
Couple of things to note first. The intention of the ViewModel in the MVVM pattern is to provide separation from the View. Therefore, your ViewModel should have no knowledge of the View itself nor the controls contained in the View. Secondly, what you should be attempting to do is have your View bind to a property of your ViewModel (with the understanding that your ViewModel serves as the DataContext of your View). Normally, you would bind a control's ItemsSource property to some collection in the ViewModel. However, you will notice the StackPanel does not implement the ItemsSource dependency property. Instead, use ItemsControl in place of your StackPanel. I would suggest some additional reading on the MVVM pattern and the binding mechanics for additional clarification.
Totally agreed with Backlash,
It seems that your ViewModel and your View are too much coupled;
There are a bunch of resources on the Internet, but here are some I preferred:
Jason Dolinger presentation video on MVVM
John Smith article introducing MVVM
I have done this before with a user control. I've had a collection of objects that i needed to dynamically to controls in a StackPanel. You can also do it with any control...I'll use a TextBlock in this example.
Create a data template with the control you want wrapped in a stack panel:
(MyText is a property in the object of the collection... see below)
<DataTemplate x:Key="MyTemplate">
<Grid Margin="0">
<StackPanel>
<TextBlock Text="{Binding Path=MyText, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
</TextBlock>
</StackPanel>
</Grid>
</DataTemplate>
Then the key is to bind to a collection of objects using an ItemsControl:
(The collection is on your viewModel)
<ItemsControl
ItemsSource="{Binding ACollection, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
ItemTemplate=" {StaticResource MyTemplate}" Background="Transparent">
</ItemsControl>
So for example if there are 3 items in "ACollection" there will be 3 TextBlocks stacked on top of each other if there are 5 in the collection there will be 5 TextBlocks etc.
Thanks All for your help, Here I solved the problem
In view model I have created ObservableCollection of FrameWorkElement type, which can hold any other controls which will be decided at runtime. Control can be a text box or button.
Public ObservableCollection < FrameWorkElement > Test
{
get{....} set{...}
}
Now I can add/set any other control to Test
Tets.Add(new TextBox()); Or Button , this will be decided at runtime.
Now bind this "Test" to ItemsControl.
<ItemsControl x:Name="itemsControl" ItemsSource={Biding Test}>
</ItemsControl>

How to show a view programmably in a position defined in plugin.xml?

I want to show views (multiple) in my plugin source code using:
showView(id, id2, IWorkbenchPage.VIEW_ACTIVATE)
This view is first closed, shown after my proccess completed.
I defined the view and its positon in plugin.xml as below:
name="..."
icon="..."
category="..."
class="..."
allowMultiple="true"
id="myid"
extension
point="org.eclipse.ui.perspectiveExtensions"
perspectiveExtension
targetID="org.eclipse.jdt.ui.JavaPerspective"
view
ratio="0.5"
relative="org.eclipse.ui.views.ContentOutline"
relationship="stack"
visible="false"
id="myid"
I want to show them top right area of perspective (the same as Outline view).
If I set visible true or open my view manually in GUI, it appears top right as I expected,
but when I use "showView()" above, views always appears at the bottom (console, problems, etc.)
How can I show my views always top right programmably?
You need to add placeholders for the rest of your views, that have a secondary ID. Another entry in your perspectiveExtension with a compound ID and a wildcard should work: myid:*. See IPageLayout javadoc for more information.

Removing a view from Eclipse Window -> Show views

We have an application in which some views only work when attached to certain perspectives.
We want to remove those views from the Window -> Show View dialog so that users cannot add them to perspectives where they don't work.
Any ideas on how to do this either programmatically or declaratively?
I have tried using <visibleWhen />, but the views are still showing in the dialog:
<view class="com.mycompany.ViewClass"
id="com.mycompany.ViewId"
name="View Name"
restorable="true">
<visibleWhen>
<with variable="activeWorkbenchWindow.activePerspective">
<equals value="com.mycompany.MyPerspective"/>
</with>
</visibleWhen>
</view>
I don't think there is any problem with the <visibleWhen /> clause, so I'm wondering if it can be used with a View?
It should be treated as a menu contribution, using the <visibleWhen/> to only display that option when a certain condition is met.
See the wiki article "Menu Contribution" for more.
Unfortunately, it seems that Eclipse already does this for the Introduction view by calling the private ViewContentProvider.removeIntroView on the content provider for the Show Views dialog. A way to get around this limitation is to define activities by adding to the org.eclipse.ui.activities extension point (see activityPatternBinding on how activities can be mapped to UI contributions). Doing this will not only remove the views from the Show Views dialog, but it will also prevent them from showing in the perspectives themselves. The views can then be shown programmatically. I had to also enable the activities in the ApplicationWorkbenchAdvisor.preStartup method because of limitations in our application:
Set<String> activityIds = new HashSet<String>();
activityIds.add("com.my.activity.id");
IWorkbenchActivitySupport activitySupport = PlatformUI.getWorkbench().getActivitySupport();
activitySupport.setEnabledActivityIds(activityIds);
In this case, the activity has to be disabled before showing the dialog, so the Show Views menu contribution has to be modified to do this as well.
Hopefully an extension point will be added to the next version of Eclipse to provide the option for developers to remove views from the dialog declaratively.