I'm having a problem with showing Dialogs from a View Model. The problem is that the "underlying content is not dimmed and disabled" as the documentation says it should be. If I click on the underlying view the button in the dialog wired to the closed command is sometimes disabled and the user is not able to click it.
I defined the DialogHost in my MainView like this (also tried it in the ShellView):
<materialDesign:DialogHost
HorizontalAlignment="Center"
VerticalAlignment="Center"
CloseOnClickAway="True" />
From my MainViewModel I show the dialog like this:
Dim errView As New ErrorView
Dim res = Await DialogHost.Show(errView)
I wired up the close command on a button in the ErrorView dialog like this:
Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}"
You problem is with the definition of DialogHost; you have it as an empty element.
The DialogHost is a ContentControl. Everything inside is what will become dimmed. So you define it at the root of your main Window/Page XAML, a bit more like:
<materialDesign:DialogHost CloseOnClickAway="True">
<StackPanel>
<TextBlock>Hello World</TextBlock>
<TextBlock>This is the main content of my application</TextBlock>
</StackPanel>
</materialDesign:DialogHost>
Related
I have an <Entry> in xaml, and I want to get that value the user types.
<Entry x:name="enteredInput>
The file with that <Entry> is in startingPage.xaml with a code behind class startingPage.xaml.cs.
Then I would like to transfer that value in the <Label> element of a different xaml, MainPage.xaml.
In your second page, add another constructor with string parameter.
For ex, If your page name is StartingPage.xaml, then add another constructor like below. Inside, assign the incoming value to your label.
public StartingPage(string entryTextFromStartingPage)
{
InitializeComponent();
lblEntryTextDisplay.Text = entryTextFromStartingPage;
}
From the StartingPage.xaml.cs, add the below code in a button click or any event that you are calling the Main page,
Navigation.PushAsync(new MainPage(enteredInput.Text);
I have just started with an ActionBar.TabListener with 3 tabs.
I selected new "Tabbed activity" in Android Studio.
My activity is called test...not the best name but I'm just trying to learn:)
I have a listView in fragment_test.xml that I want to fill with data after a raw sql search.
If I put this code in onCreateView then everytime I click on a tab it will re-write that tab with the same info in the listView.
What I want is to have diffrent information in those tabs.... then I need to know which tab that is clicked. That I did with mViewPager.getCurrentItem() ....Is this right? How can i get the name of the tab instead?
I have also found onTabSelected...should I put my code here? In this case I think I know which tab that is selected but is it really wise to put the code here?
If I do this then listView1 becomes null...why?:
public void onTabSelected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) {
listView1 = (ListView)findViewById(R.id.listView2);
listAdapter2 = new ArrayAdapter<String>(context, R.layout.simplerow, testArray);
listAdapter2.notifyDataSetChanged();
listView1.setAdapter(listAdapter2);
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView2"
android:layout_centerHorizontal="true" />
If I understand it correctly, you want to load Fragment's ListView according to Tab's selected position.
If that's the case, you should not modify Fragment's ListView in Activity. Instead, pass Tab's selected position to Fragment as an argument from Activity and load ListView in Fragment according to that position.
I want to create a button that can show a window to show details of elements in listbox when it's clicked. the listbox itsetf was created from a list of JSONObject like this:
<listbox id="userListbox">
<listhead>
<listheader laber="Action"></listheader>
<listheader label="Id"></listheader>
<listheader label="Name"></listheader>
<listheader label="Address"></listheader>
<listheader label="Phone"></listheader>
</listhead>
<listitem forEach="${userController.list}">
<listcell>
<button label="Detail" id="detailButton"></button>
</listcell>
<listcell label="${each.id}" ></listcell>
<listcell label="${each.name}" ></listcell>
<listcell label="${each.address}" ></listcell>
<listcell label="${each.phone}" ></listcell>
</listitem>
</listbox>
for every row (listcell) there is always a button to show the details. but when I load the page, it failed to show the list with error message:
Not unique in ID space < Window cP8Q0#userWindow>: detailButton.
any idea to show a window when the button clicked? here is the code when button is clicked:
#Listen("onClick = #detailButton")
public void showModal(Event event) {
Component comp = Executions.createComponents("/widgets/window/modal_dialog/employee_dialog.zul", null, null);
if(comp instanceof Window) {
((Window)comp).doModal();
}
}
thank you for your help.
The problem is that if you click on different buttons you are running the createComponents again and again. Your employee_dialog.zul is only safe to include into the page once as it has IDs in it; if you do the operation twice you are creating a second set of components with the same ID and the IDs should be unique within a given idSpace (see the ZK developer guide for the theory).
There are other issues here: why create the components twice? Why not keep one and only one set around, showing and hiding them based on button clicks. That is more efficient.
Look at Button to Show a Window from Listbox Row which shows that you can:
<zk>
<!-- hidden -->
<window id="wnd" title="My Modal" visible="false" width="300px">
<button label="close" onClick="wnd.visible = false"/>
</window>
<!-- click button to pop the hidden window! -->
<button label="do it" onClick="wnd.doModal()"/>
</zk>
So you can use a
<include src="/widgets/window/modal_dialog/employee_dialog.zul">
to pull the model dialog into the bottom of the main page once and only once. Then in the code you can set the data into it and do
win1.doModal();
where win1 is the modal window defined in the fragment. You have to tell the model window what to display before you pop it but that is not hard. Use desktopScope.put( "myName", this) to have the controller/view-model of the dialog box register itself in a location where the controller/view-model in the main window can find it and talk to it to pass it the data to render.
Two other tips.
Hide your fragments as /WEB-INF/zul/employee_dialog.zul as anything under WEB-INF cannot be directly accessed by a browser for better security.
Try not to put any zul into your java. That is mixing behaviour with presentation. Sometimes it is unavoidable but always try first to keep the zul in the zul then interact with it via java IDs only (much like my suggestion). It is not always possible but separation of logic from layout is a core design pattern.
Simon
<button label="Detail" />
#Listen("onClick = listbox listitem listcell button")
I have created a lookless control using silverlight 4. This control contains a textbox which the user will type data into and a button that increases the size of the textbox by increasing the MinHeight of the control by 10 each time it is pressed (I have set the textbox to stretch so it grows with the control).
This bit works fine but I now want to extend the controls functionality by adding another textbox that will display the current MinHeight of the control which I dont seem to be able to do. I have been trying
Text="{Binding RelativeSource={RelativeSource Self}, Path=MinHeight, Mode=TwoWay}">
Im not sure why but this always shows as 0
Update
In my attempts to resolve I tried chaging the name of the source textbox to PART_sourceData and just to see if the binding was correct I set the path to the text property. This appears to bring through the text of the sourcedata as I would expect
Text="{Binding Mode=TwoWay, ElementName=PART_sourceData, Path=Text}"
My next step was to change the path to Height
Text="{Binding Mode=TwoWay, ElementName=PART_sourceData, Path=Height}"
But this returns NaN. Therefore I tried MinHeight
Text="{Binding Mode=TwoWay, ElementName=PART_sourceData, Path=MinHeight}"
This always returns 0 even though the code behind has a valid number. Whats going wrong? Becuase the text comes through properly I beleive the binding to be correct but whats wrong with getting the height?
By binding to RelativeSource Self you are looking at that controls MinHeight. You will need to name your original TextBox with the x:Name attribute, then use ElementName binding.
Ok I have a solution. Not the best but it works!
I have had to create a new dependancy property
public static readonly DependencyProperty EditorHeightProperty =
DependencyProperty.Register("EditorHeight", typeof(string), typeof(EditorControl), new PropertyMetadata(default(string)));
public string EditorHeight
{
get { return (string)GetValue(EditorHeightProperty); }
set { SetValue(EditorHeightProperty, value); }
}
Then I bind the text to this property using
Text="{TemplateBinding EditorHeight}"
Hii,
I am creating a WPF aplication. My home page will look like the one I have shown in the image.
In which i will have following componenents:
1. Topbar
2. Left bar - slide down menu like accordion which will slide down on selection if it has any submenu items otherwise on selection it will show related form.
3. Main panel - in which i will open my child forms
4. Bottom bar.
I would prefer if i get already implemented application that i can reuse in my application, as I think this form is gonna take hell lot of time. And Also as I am new to WPF, I would love to have some guidance about following points
How to make a slide down accordion like menu in WPF, which are also supposed to have submenu in it. ex. Report menu - will have list of all reports in it, which will be displayed when you click on the reports menu. How can I accomplish this in WPF>
How to open child form in right side panel? What controls/components should I use in my form to host child forms?
Any sample applications, web references, or already implemented code will be of great help as I have very strict deadline and dont afford to spend much time in exploring.
Abandon full accordion functionality
If you can live without a full accordion, you could easily accomplish something similar to what you want by using a TabControl, with alternate layout (TabStripPlacement="Left").
See this question (the same as in my comments): Create Tabbed Sidebar with sections WPF
Existing Library
There are existing WPF control libraries with accordions:
WPF Toolkit
Telerik Rad controls - http://www.telerik.com/products/wpf.aspx (or silverlight/asp.net MVC, etc)
Many others, most of them for money...
DIY
You can try using a TreeView to implement your accordion, too. You just need a few tricks up your sleeve to accomplish this:
First, you need to hide the tree-view buttons. They will mess up what we're trying to accomplish. See this question - Treeview hide [+] [-] buttons
Second, you want to ensure that the IsExpanded property is set to true if a TreeViewItem or one of its children is selected, and set to false otherwise. You can do this with a IMultiValueConverter combined with a Style for TreeViewItem.
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApplication1">
<!-- ... -->
<TreeView>
<TreeView.Resources>
<local:SelectedItemToIsChildConverter x:Key="isChildConverter" />
<Style TargetType="{x:Type TreeViewItem}">
<Style.Setters>
<Setter Property="IsExpanded">
<Setter.Value>
<MultiBinding Converter="{StaticResource isChildConverter}">
<Binding Path="SelectedItem"
RelativeSource="{RelativeSource AncestorType={x:Type TreeView}}" />
<Binding RelativeSource="{RelativeSource Self}" />
</MultiBinding>
</Setter.Value>
</Setter>
</Style.Setters>
</Style>
</TreeView.Resources>
<!-- Children here, or set ItemsSource property via databinding -->
</TreeView>
Here's the code for the converter, in separate CS file:
public class SelectedItemToIsChildConverter : IMultiValueConverter
{
public object Convert(object[] values, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
TreeViewItem selectedItem = values.Length > 0 ? values[0] as TreeViewItem : null;
TreeViewItem targetItem = values.Length > 1 ? values[1] as TreeViewItem : null;
if (targetItem == null)
return false;
TreeViewItem currentItem = selectedItem;
while (currentItem != null)
{
if (currentItem == targetItem)
return true;
currentItem = currentItem.Parent as TreeViewItem;
}
return false;
}
public object[] ConvertBack(object value, Type[] targetTypes, object parameter, System.Globalization.CultureInfo culture)
{
throw new NotImplementedException();
}
}
After this, you would have to style it to make it look nice, and support animation.
Once this is all done, use a grid to split up your UI. Use data binding to show content on your main UI area, based off the selected tree view item.
Edit:
Actually, a tree view is a poor base for an accordion. I searched a bit for details on accordion controls, and it turns out that they tend to only have one level of hierarchy.
With this description in mind, it may be easier to use a DataGrid, and take advantage of the RowDetails to expand your accordion view.
Here's a brief tutorial: http://www.wpftutorial.net/DataGrid.html#rowDetails
Just make sure most of the data grid features are disabled.