C#:How to refresh someone tab by itself after doing something in other tabs? - tabcontrol

<UserControl.DataContext>
<local:Model1 />
</UserControl.DataContext>
<Grid x:Name="LayoutRoot">
<telerik:RadTabControl Name="tab">
<telerik:RadTabItem x:Name="Tab0"
Height="30"
MinWidth="100"
Header="t1"
TabIndex="0">
<my:Control1 />
</telerik:RadTabItem>
<telerik:RadTabItem x:Name="Tab1"
Height="30"
MinWidth="100"
Header="t2"
TabIndex="1">
<my:Control2 />
</telerik:RadTabItem>
<telerik:RadTabItem x:Name="Tab2"
Height="30"
MinWidth="100"
Header="t3"
TabIndex="2">
<my:Control3 />
</telerik:RadTabItem>
</telerik:RadTabControl>
The following is my tabcontrol
All controls in Radtabitems are showing table whose data is from database.
All controls in Radtabitems have refresh function that use to refresh when date in database is refreshed.
The question is how can I refresh someone tab by itself after I do something in other tabs?
Please help me. Thanks.

<my:Control2 x:Name = "myControl1"/>
and use selectionchanged in your .cs
.cs
selectionchanged....
{
//if itemIndex = 1
Control2 temp = myControl1;
//some veiwing model...for example: ViewControl2
if(temp.Datacontext is ViewControl2)
{
ViewControl2 Viewtmp = temp.Datacontext as ViewControl2;
Viewtmp.Refresh();//your refresh function can create in Viewtmp
}
}

Related

Update view on orientation change

I have registered a orientationChangedEvent like this:
app.on(app.orientationChangedEvent, (args: OrientationChangedEventData) => {
if (this.currentScreenWidth === screen.mainScreen.widthDIPs) {
this.currentScreenWidth = screen.mainScreen.heightDIPs;
} else {
this.currentScreenWidth = screen.mainScreen.widthDIPs;
}
this.configureGrid();
});
I have the following template:
<GridLayout [rows]="rows" [columns]="columns">
<ng-container *ngFor="let card of cards">
<StackLayout [row]="card.row" [col]="card.col" [colSpan]="card.colSpan">
<kirby-card>
<kirby-card-header [title]="'row: ' + card.row" [subtitle]="'col: ' + card.col">
</kirby-card-header>
<StackLayout class="content">
<Label text="Here you can add stuff, which is cool."></Label>
</StackLayout>
<kirby-card-footer>
<kirby-button label="Dummy Kirby Button" expand="block" shape="round" theme="cookbook"></kirby-button>
</kirby-card-footer>
</kirby-card>
</StackLayout>
</ng-container>
and in my configureGrid method I update the rows, columns and cards properties, but my view is not updating, the view (GridLayout) simply display exactly the same as before the rotation. I have logged out all the data, and my data does change, so it seems the data binding does not understand that the data has changed.
Can I somehow force a update of the view, or how do I fix this problem?
Thank you
Do the data update with NgZone, and all is good.

How can I add sort items into a fragment dialog?

I have this fragment retrieve by this page https://openui5.hana.ondemand.com/explored.html#/sample/sap.m.sample.TableViewSettingsDialog/code
<core:FragmentDefinition
xmlns="sap.m"
xmlns:core="sap.ui.core">
<ViewSettingsDialog
confirm="handleConfirm" id='viewSettingsDialogId'>
<sortItems id="sortItemsId">
<!-- <ViewSettingsItem text="Product" key="Name" selected="true" />
<ViewSettingsItem text="Supplier" key="SupplierName" />
<ViewSettingsItem text="Weight" key="WeightMeasure" />
<ViewSettingsItem text="Price" key="Price" /> -->
</sortItems>
</ViewSettingsDialog>
</core:FragmentDefinition>
I want insert manually the sortItems in the control (or by data-binding in the xml-View).
How can I do it?
I try to do it by code in my controller:
//IF CLICK ON SETTINGS BUTTON
handleViewSettingsDialogButtonPressed: function (oEvent) {
if (!this._oDialog) {
this._oDialog = sap.ui.xmlfragment("apps.appIntra.fragment.settingDialog", this);
}
// toggle compact style
jQuery.sap.syncStyleClass("sapUiSizeCompact", this.getView(), this._oDialog);
this._oDialog.open();
var element=sap.ui.getCore().byId("sortItemsId");
this.byId('sortItemsId').addSortItem(new sap.m.ViewSettingsItem({text:"field1", key:"Price"}));
this.byId('sortItemsId').addSortItem(new sap.m.ViewSettingsItem({text:"field2", key:"PLUTO"}));
},
But it not work...
I see this guide http://scn.sap.com/community/developer-center/front-end/blog/2014/02/20/sapui5-dialogwith-businesscard-as-xml-fragment-along-with-controller
but if I use
var element=sap.ui.getCore().byId("sortItemsId");
element value is undefined
The addSortItem is a method that works on the ViewSettingsDialog and not on sortItems.
Therefore, as you have already provided the id viewSettingsDialogId for the ViewSettingsDialog control, in you controller you can do the following,
var oViewSettingsDialog = sap.ui.getCore().byId("viewSettingsDialogId");
oViewSettingsDialog.addSortItem(new sap.m.ViewSettingsItem({text:"field1",
key:"Price"}));
/* and so on... */
This would add the sort items into the sortItems list.

Datagrid not updating, Visibility property on datagridtextcolumn

So As you can see the ID column should be hidden but its not. And the debugger is showing the value of IDVisible in the xaml file to be "Hidden" but it never makes it to the window. I am calling a property changed method as well. What am I doing wrong, the ID column should disappear or at least that's what I am trying to do.
And here is the code for MainWindowViewModel.cs
namespace MagicDB
{
class MainWindowViewModel : ObservableObject
{
private CardDB _cards;
private Command _InitCardDB;
private Visibility _IDVisible;
public CardDB Cards
{
get { return _cards; }
set { _cards = value; OnPropertyChanged("Cards"); }
}
public Visibility IDVisible
{
get { return _IDVisible; }
set { _IDVisible = value; VerifyPropertyName("IDVisible"); OnPropertyChanged("IDVisible"); }
}
public MainWindowViewModel()
{
IDVisible = Visibility.Hidden;
_InitCardDB = new Command(InitDB, true);
Cards = new CardDB();
}
And the xaml file....
<Window x:Class="WpfDataGrid.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Width="500" Height="500">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50" />
<RowDefinition Height="450*" />
</Grid.RowDefinitions>
<DataGrid AutoGenerateColumns="False"
HorizontalAlignment="Left"
Name="dataGrid1"
VerticalAlignment="Top"
ItemsSource="{Binding Cards.cardDB}"
CanUserReorderColumns="True"
CanUserResizeColumns="True"
CanUserResizeRows="False"
CanUserSortColumns="True"
AlternatingRowBackground="LightBlue"
Width="480" Height="auto" Grid.Row="1" IsSynchronizedWithCurrentItem="True"
>
<DataGrid.Columns>
<DataGridTextColumn Header="ID" Binding="{Binding CardID}" Width="25" Visibility="{Binding IDVisible,Mode=TwoWay}"></DataGridTextColumn>
I would check your Visible binding as it is most likely failing. This page explains a few methods that you can use. I personally prefer adjusting the trace level.
I believe the reason that the binding is failing is due to the fact that your DataContext (I assume you have set it somewhere) isn't getting to the DataGrid's columns themselves. This page explains a fix that I have used in the past to solve this problem. I think I originally found that article from this page that has several other good to know WPF 'Gotchas'.

MVVM DataGrid copy information from selected cells

I’m using .Net 4.0 DataGrid with MVVM pattern. I need to enable user to select cells and copy information from selected cells to other DataGrid rows (either via keyboard shortcut or context-menu copy/paste). I tried to achieve this via SelectedItem or sending SelectedItem as CommandParameter but this functions only with the whole row and not with cells.
(DataGrid is bound to ObservableCollection that contains objects with float fields. These fields are then mapped to DataGrid cells)
So, is there any solution in WPF MVVM how to copy DataGrid cells from one row to another?
Thanks in advance
xaml:
<DataGrid Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="9" AutoGenerateColumns="False" Height="Auto" HorizontalAlignment="Left"
Name="dataGrid" VerticalAlignment="Top" Width="{Binding ElementName=grid4,Path=Width}"
ScrollViewer.CanContentScroll="False" FrozenColumnCount="1" SelectionUnit="Cell" SelectionMode="Extended" CanUserSortColumns = "False"
CanUserReorderColumns="False" CanUserResizeRows="False" RowHeight="25" RowBackground="LightGray" AlternatingRowBackground="White"
ScrollViewer.VerticalScrollBarVisibility="Visible" ScrollViewer.HorizontalScrollBarVisibility="Visible"
ItemsSource="{Binding Layers, Mode=TwoWay}" SelectedItem="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Path=DataContext.Selection, Mode=TwoWay}">
<DataGrid.InputBindings>
<KeyBinding Gesture="Shift" Command="{Binding ItemHandler}" CommandParameter="{Binding ElementName=dataGrid, Path=SelectedItems}"></KeyBinding>
</DataGrid.InputBindings>
ViewModel:
private float _selection = 0.0f;
public float Selection
{
get
{
return _selection;
}
set
{
if (_selection != value)
{
_selection = value;
NotifyPropertyChanged("Selection");
}
}
}
...
public DelegateCommand<IList> SelectionChangedCommand = new DelegateCommand<IList>(
items =>
{
if (items == null)
{
NumberOfItemsSelected = 0;
return;
}
NumberOfItemsSelected = items.Count;
});
public ICommand ItemHandler
{
get
{
return SelectionChangedCommand;
}
}
I think you might be after the SelectionUnit property. Setting this to CellOrRowHeader changes the selection method from full row to a single cell.
You do lose the nice "what row am I on?" highlighting but you are focusing on a single cell. (You could probably extend the datagrid to add your own highlight with the current row logic.)
<DataGrid AutoGenerateColumns="True" Grid.Column="1" Grid.Row="0"
HorizontalAlignment="Stretch" Name="dataGrid" VerticalAlignment="Stretch"
DataContext="{Binding}" ItemsSource="{Binding Path=MyDataTable}"
IsReadOnly="True" SelectionMode="Extended" SelectionUnit="CellOrRowHeader" />

How can I make a grid of clickable images from a list of data in WPF?

I am a seasoned C and Java programmer, but an absolute WPF newbie.
I am creating a kiosk application that will display a list of images of products that the user will click to see product details and maybe place an order.
I am trying to structure my app with MVVM Foundation because I am used to the benefits of structure and tests.
I wonder what is the most natural way to create a grid of clickable images that will fill the screen left to right, top to bottom (or the other way round, I have no exact requirements).
Any image should be bound to an object that will become current and be displayed in the next screen.
Thanks for your help.
OK! Listen up! Here is how you do that! :)
1) Use ItemsControl together with UniformGrid to get automatic aligment
<ItemsControl>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid>
</UniformGrid>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<Button Width="50" Height="50"/>
<Button Width="50" Height="50"/>
<Button Width="50" Height="50"/>
</ItemsControl>
2) Populate ItemsControl with data from your viewmodel
<ItemsControl ItemsSource="{Binding Path=ImageList}"...
public ObservableCollection<ClickableImage> ImageList
{
get { return m_ImageList;}
}
... constructor
{
m_ImageList = new ObservableCollection<ClickableImage>();
m_ImageList.Add(new ClickableImage("image.png");
}
TADAAAA!
I have refined a little the code. Here is the namespace declaration
xmlns:vm="clr-namespace:TestSandbox.ViewModels"
the DataContext
<UserControl.DataContext>
<vm:ViewModel1/>
</UserControl.DataContext>
and the uniformGrid
<ItemsControl Name="imageList" ItemsSource="{Binding Path=Products}" BorderBrush="#FFA90606" Background="#FFE70F0F">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Margin="50">
</UniformGrid>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<!-- The Image binding -->
<Image Source="{Binding Path=image}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
here is the C# code in the view model
public List<Product> Products {get; set; }
public ViewModel1()
{
Products = new List<Product>();
Products.Add(MakeProduct(#"..\images\beemovie.jpg"));
Products.Add(MakeProduct(#"..\images\darkknight.jpg"));
Products.Add(MakeProduct(#"..\images\matrix.jpg"));
Products.Add(MakeProduct(#"..\images\milo.jpg"));
Products.Add(MakeProduct(#"..\images\superhero.jpg"));
Products.Add(MakeProduct(#"..\images\twilight.jpg"));
Products.Add(MakeProduct(#"..\images\xfiles.jpg"));
}
public Product MakeProduct(string path)
{
return new Product(path, MakeImage(path));
}
public BitmapImage MakeImage(string path)
{
BitmapImage bmpi = new BitmapImage();
bmpi.BeginInit();
bmpi.UriSource = new Uri(path, UriKind.Relative);
bmpi.EndInit();
return bmpi;
}
In ViewModel add ObservableList<ClickableImage> m_Images as public property.
In XAML use ListView for displaying ClickableImage.
Create datatemplate for ClickableImage with Image and raised command uppon click.
On the XAML:
<Button Command="{Binding Path=OnClickCommand}"/>
On the ViewModel:
public ICommand OnClickCommand {
get
{
return new RelayCommand(aram => this.Click(), param => this.CanClick);
}
}
public void Click() {
//i was clicked!
globalBigImageViewModel.BigImageContent = m_Image;
}