Jump to content
UBot Underground

Ultimate Ui - Create Beautiful Uis With Xaml, Datagrid, Metro & More!


Recommended Posts

Contact them (Ubot staff).

 

I've bought one of Nick's video tutorials and it was invaluable to me.

I'm going to upgrade to Dev if I can get a decent discount and buy some of Nick's plugins.

Link to post
Share on other sites
  • Replies 175
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Popular Posts

Update version 1.4   Added - Wiki with lots of information can now be found here: https://github.com/nicklikescoffee/UltimateUiPlugin/wiki Added - Get DataGrid Cell Value - gets the value of the cell

Bought this and I'm super impressed - barely scratched the surface and can't believe how powerful it is. It's literally the missing piece of the puzzle. After dealing with frustrations of the old XAML

Update version 1.7   Fixed - Bug that caused button clicks to freeze application

Posted Images

i have created listview like this but if i use get listview property selected index it returns 2 instead of the value which is at selected index

 

 

plugin command("UltimateUI.dll", "UI Load XAML", "    <ListView Margin=\"10,10,0,13\" Name=\"ListView1\" HorizontalAlignment=\"Left\" VerticalAlignment=\"Top\" Width=\"194\" Height=\"200\">  
        <ListViewItem Content=\"Coffie\"></ListViewItem>  
        <ListViewItem Content=\"Tea\"></ListViewItem>  
        <ListViewItem Content=\"Orange Juice\"></ListViewItem>  
        <ListViewItem Content=\"Milk\"></ListViewItem>  
        <ListViewItem Content=\"Iced Tea\"></ListViewItem>  
        <ListViewItem Content=\"Mango Shake\"></ListViewItem>  
    </ListView>  ", "False", "False", "False", "BaseLight", "Blue")

 

Link to post
Share on other sites

I made this from your sample code and it worked correctly for me here:

plugin command("UltimateUI.dll", "UI Load XAML", "<Grid>
        <ListView x:Name=\"myList\" HorizontalAlignment=\"Left\" Height=\"185\" Margin=\"70,49,0,0\" VerticalAlignment=\"Top\" Width=\"256\">           
            <ListView.View>
            
        <GridView>
                    <GridViewColumn/>
                </GridView>
            </ListView.View>

            <ListViewItem Content=\"Coffie\"></ListViewItem>
            <ListViewItem Content=\"Tea\"></ListViewItem>
            <ListViewItem Content=\"Orange Juice\"></ListViewItem>
            <ListViewItem Content=\"Milk\"></ListViewItem>
            <ListViewItem Content=\"Iced Tea\"></ListViewItem>
            <ListViewItem Content=\"Mango Shake\"></ListViewItem>
            
        </ListView>

    </Grid>", "False", "False", "False", "BaseLight", "Blue")
plugin command("UltimateUI.dll", "UI Add ListView Event", "SelectionChanged", "myList", "listTest")
define listTest {
    alert($plugin function("UltimateUI.dll", "$UI Get ListView Property", "SelectedIndex", "myList"))
}

i have created listview like this but if i use get listview property selected index it returns 2 instead of the value which is at selected index

 

 

plugin command("UltimateUI.dll", "UI Load XAML", "    <ListView Margin=\"10,10,0,13\" Name=\"ListView1\" HorizontalAlignment=\"Left\" VerticalAlignment=\"Top\" Width=\"194\" Height=\"200\">  
        <ListViewItem Content=\"Coffie\"></ListViewItem>  
        <ListViewItem Content=\"Tea\"></ListViewItem>  
        <ListViewItem Content=\"Orange Juice\"></ListViewItem>  
        <ListViewItem Content=\"Milk\"></ListViewItem>  
        <ListViewItem Content=\"Iced Tea\"></ListViewItem>  
        <ListViewItem Content=\"Mango Shake\"></ListViewItem>  
    </ListView>  ", "False", "False", "False", "BaseLight", "Blue")

 

 

Link to post
Share on other sites

 

I made this from your sample code and it worked correctly for me here:

plugin command("UltimateUI.dll", "UI Load XAML", "<Grid>
        <ListView x:Name=\"myList\" HorizontalAlignment=\"Left\" Height=\"185\" Margin=\"70,49,0,0\" VerticalAlignment=\"Top\" Width=\"256\">           
            <ListView.View>
            
        <GridView>
                    <GridViewColumn/>
                </GridView>
            </ListView.View>

            <ListViewItem Content=\"Coffie\"></ListViewItem>
            <ListViewItem Content=\"Tea\"></ListViewItem>
            <ListViewItem Content=\"Orange Juice\"></ListViewItem>
            <ListViewItem Content=\"Milk\"></ListViewItem>
            <ListViewItem Content=\"Iced Tea\"></ListViewItem>
            <ListViewItem Content=\"Mango Shake\"></ListViewItem>
            
        </ListView>

    </Grid>", "False", "False", "False", "BaseLight", "Blue")
plugin command("UltimateUI.dll", "UI Add ListView Event", "SelectionChanged", "myList", "listTest")
define listTest {
    alert($plugin function("UltimateUI.dll", "$UI Get ListView Property", "SelectedIndex", "myList"))
}

thanks will check again

Link to post
Share on other sites

Hi nick,

 

is there anyway we can change individual cell value of datagrid after a row has been added, this can be useful, say we want to update only a single cell value  and not the other cells , because this way , let us say we have a button called analyze and user clicks the analyze button, then a single cell will update of that row of that datagrid showing a new value rather than updating the entire row of datagrid and this also means we don't need a fresh datagrid just to show updated values

  • Like 1
Link to post
Share on other sites
  • 3 weeks later...

Nick, are you here?

 

I need to create a Log and I have problem TextBlock control doesn't maintain the last Log text (replaces new text in the control).

 

You probably wouldn't use a textblock for this, but yes it will replace it so you will either have to have an internal variable or something to keep track of it or you can also get the text like so:

plugin command("UltimateUI.dll", "UI Load XAML", "<TextBlock x:Name=\"log\"/>", "False", "False", "False", "BaseLight", "Blue")
plugin command("UltimateUI.dll", "UI Set TextBlock Property", "Text", "log", "one")
set(#log,$plugin function("UltimateUI.dll", "$UI Get TextBlock Property", "Text", "log"),"Global")
plugin command("UltimateUI.dll", "UI Set TextBlock Property", "Text", "log", "{#log}
two")

I'll post another example soon of something closer to what you probably want instead.

Link to post
Share on other sites

This is probably closer to what you want:

plugin command("UltimateUI.dll", "UI Load XAML", "<TextBox x:Name=\"Log\" 
                 Height=\"200\" 
                 IsReadOnly=\"True\"
                 VerticalScrollBarVisibility=\"Auto\"/>", "False", "False", "False", "BaseLight", "Blue")
clear list(%log)
loop(20) {
    add item to list(%log,"{$date} - {$random text($rand(30,50))}","Don\'t Delete","Global")
    plugin command("UltimateUI.dll", "UI Set TextBox Property", "Text", "Log", %log)
    wait(1)
}
  • Like 1
Link to post
Share on other sites

 

This is probably closer to what you want:

plugin command("UltimateUI.dll", "UI Load XAML", "<TextBox x:Name=\"Log\" 
                 Height=\"200\" 
                 IsReadOnly=\"True\"
                 VerticalScrollBarVisibility=\"Auto\"/>", "False", "False", "False", "BaseLight", "Blue")
clear list(%log)
loop(20) {
    add item to list(%log,"{$date} - {$random text($rand(30,50))}","Don\'t Delete","Global")
    plugin command("UltimateUI.dll", "UI Set TextBox Property", "Text", "Log", %log)
    wait(1)
}

thanks Nick, how to keep the textbox auto scroll down and always show the bottom line of the log?

 

Link to post
Share on other sites

Hi nick,

 

is there anyway we can change individual cell value of datagrid after a row has been added, this can be useful, say we want to update only a single cell value  and not the other cells , because this way , let us say we have a button called analyze and user clicks the analyze button, then a single cell will update of that row of that datagrid showing a new value rather than updating the entire row of datagrid and this also means we don't need a fresh datagrid just to show updated values

 

and waiting datagrid sort/search... hope available in next update

Link to post
Share on other sites

and waiting datagrid sort/search... hope available in next update

Also anxiously awaiting sort and search as well as shift click to multiple select and select all feature.

 

Sent from my LG-H932 using Tapatalk

Link to post
Share on other sites
  • 1 month later...

Hi Nick, 
What command to save from datagrid to table? list or variable?
i need saving datagrid to file

 

thank you

 

 

+++++++++++++++++++++++++++++++++++++++++++

 

EDITED : 

 

Found it : get datagrid cell value

I hope next update will cover command : datagrid to table

 

Link to post
Share on other sites

Hi Nick, 

What command to save from datagrid to table? list or variable?

i need saving datagrid to file

 

thank you

loop through the datagrid and get data from each row, thats what i did

 

loop($plugin function("UltimateUI.dll", "$UI Get DataGrid Row Count", "dataGrid2")) {

    set table cell(&saveSearchResults,#track_TableRowForSaveVideoResults,0,$plugin function("HeopasCustom.dll", "$Heopas Xpath Parser", $plugin function("UltimateUI.dll", "$UI Get DataGrid Row", "dataGrid2", $subtract(#track_TableRowForSaveResults,1)), "//textcolumnmodel/text", "InnerText", 0))

    set table cell(&saveSearchVideosResults,#track_TableRowForSaveVideoResults,1,$plugin function("HeopasCustom.dll", "$Heopas Xpath Parser", $plugin function("UltimateUI.dll", "$UI Get DataGrid Row", "dataGrid2", $subtract(#track_TableRowForSaveResults,1)), "//textcolumnmodel/text", "InnerText", 1))

  

Link to post
Share on other sites
  • 3 weeks later...

Hi Nick,

 

Could you post some sample code on how to change UI buttons appearance on hover? I can set the buttons background color and border with something like:

<Border Padding="8">
     <Border.Resources>
        <Style TargetType="{x:Type Button}">
                <Setter Property="Background" Value="#181818" />
                <Setter Property="BorderBrush" Value="#181818" />
                <Setter Property="Foreground" Value="#B3B5B1" />
          </Style>
     </Border.Resources>
</Border>

However, when I add some code like:

<Style.Triggers>
   <Trigger Property="IsMouseOver" Value="True">
        <Setter Property="Background" Value="#FFF" />
        <Setter Property="BorderBrush"  Value="#FFF"/>
   </Trigger>
</Style.Triggers>

In between the <Style> tags it doesn't take effect - the default styling still applies to the hover state.

 

Could you point me in the right direction on how to customize WPF elements on different states (such as hover)?

 

Would be much appreciated. Thanks in advance!

Link to post
Share on other sites

loop through the datagrid and get data from each row, thats what i did

 

loop($plugin function("UltimateUI.dll", "$UI Get DataGrid Row Count", "dataGrid2")) {

    set table cell(&saveSearchResults,#track_TableRowForSaveVideoResults,0,$plugin function("HeopasCustom.dll", "$Heopas Xpath Parser", $plugin function("UltimateUI.dll", "$UI Get DataGrid Row", "dataGrid2", $subtract(#track_TableRowForSaveResults,1)), "//textcolumnmodel/text", "InnerText", 0))

    set table cell(&saveSearchVideosResults,#track_TableRowForSaveVideoResults,1,$plugin function("HeopasCustom.dll", "$Heopas Xpath Parser", $plugin function("UltimateUI.dll", "$UI Get DataGrid Row", "dataGrid2", $subtract(#track_TableRowForSaveResults,1)), "//textcolumnmodel/text", "InnerText", 1))

  

 

GREAT... THANKS

Link to post
Share on other sites

Hi Nick,

 

Could you post some sample code on how to change UI buttons appearance on hover? I can set the buttons background color and border with something like:

<Border Padding="8">
     <Border.Resources>
        <Style TargetType="{x:Type Button}">
                <Setter Property="Background" Value="#181818" />
                <Setter Property="BorderBrush" Value="#181818" />
                <Setter Property="Foreground" Value="#B3B5B1" />
          </Style>
     </Border.Resources>
</Border>

However, when I add some code like:

<Style.Triggers>
   <Trigger Property="IsMouseOver" Value="True">
        <Setter Property="Background" Value="#FFF" />
        <Setter Property="BorderBrush"  Value="#FFF"/>
   </Trigger>
</Style.Triggers>

In between the <Style> tags it doesn't take effect - the default styling still applies to the hover state.

 

Could you point me in the right direction on how to customize WPF elements on different states (such as hover)?

 

Would be much appreciated. Thanks in advance!

 

Yes probably something like this:

 

<Grid>
        <Grid.Resources>
            <Style x:Key="FocusVisual">
                <Setter Property="Control.Template">
                    <Setter.Value>
                        <ControlTemplate>
                            <Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <SolidColorBrush x:Key="Button.Static.Background" Color="#FF181818"/>
            <SolidColorBrush x:Key="Button.Static.Border" Color="#FF181818"/>
            <SolidColorBrush x:Key="Button.MouseOver.Background" Color="#FFFFFFFF"/>
            <SolidColorBrush x:Key="Button.MouseOver.Border" Color="#FFFFFFFF"/>
            <SolidColorBrush x:Key="Button.Pressed.Background" Color="#FFC4E5F6"/>
            <SolidColorBrush x:Key="Button.Pressed.Border" Color="#FF2C628B"/>
            <SolidColorBrush x:Key="Button.Disabled.Background" Color="#FFF4F4F4"/>
            <SolidColorBrush x:Key="Button.Disabled.Border" Color="#FFADB2B5"/>
            <SolidColorBrush x:Key="Button.Disabled.Foreground" Color="#FF838383"/>
            <Style x:Key="CustomButton" TargetType="{x:Type Button}">
                <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
                <Setter Property="Background" Value="{StaticResource Button.Static.Background}"/>
                <Setter Property="BorderBrush" Value="{StaticResource Button.Static.Border}"/>
                <Setter Property="Foreground" Value="#FFB3B5B1"/>
                <Setter Property="BorderThickness" Value="1"/>
                <Setter Property="HorizontalContentAlignment" Value="Center"/>
                <Setter Property="VerticalContentAlignment" Value="Center"/>
                <Setter Property="Padding" Value="1"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type Button}">
                            <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
                                <ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                            </Border>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsDefaulted" Value="true">
                                    <Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                                </Trigger>
                                <Trigger Property="IsMouseOver" Value="true">
                                    <Setter Property="Background" TargetName="border" Value="{StaticResource Button.MouseOver.Background}"/>
                                    <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.MouseOver.Border}"/>
                                </Trigger>
                                <Trigger Property="IsPressed" Value="true">
                                    <Setter Property="Background" TargetName="border" Value="{StaticResource Button.Pressed.Background}"/>
                                    <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Pressed.Border}"/>
                                </Trigger>
                                <Trigger Property="IsEnabled" Value="false">
                                    <Setter Property="Background" TargetName="border" Value="{StaticResource Button.Disabled.Background}"/>
                                    <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Disabled.Border}"/>
                                    <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="{StaticResource Button.Disabled.Foreground}"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Grid.Resources>
        <Button Content="Your Content" Style="{DynamicResource CustomButton}"/>
    </Grid>

And I know probably what that looks like

 

giphy.gif

 

But here is the EASY way to do it:

 

1. Go into Visual Studio (probably Blend would work too)

2. Make a normal button

3. In the visual designer right click on the button then go to Edit Template-> Edit a Copy

4. Place it in the relevant resources section (e.g. in the top level grid if you want to use it everywhere)

5. Use the name wherever you want it, e.g. Template="{DynamicResource CustomButton}"

 

Note: I added FF in front of the 6 letter/number color code just because in the template that is the format that use. 

 

Note: You may want to change the IsPressed, etc as well to make it look better.

  • Like 1
Link to post
Share on other sites

Edit: I had Metro on in the previous version (which would work too) - so this is for a normal button

Is it possible to drag and drop stuff or only possible to do that in code behind in #C.

 

https://docs.microsoft.com/en-us/dotnet/framework/wpf/advanced/walkthrough-enabling-drag-and-drop-on-a-user-control

Link to post
Share on other sites
  • 2 weeks later...

Edit: I had Metro on in the previous version (which would work too) - so this is for a normal button

Thank you so much for the help - I was able to get it working with the info you provided - eternally grateful for all your awesome training, plugins, and support.

 

Meant to thank you earlier but by the time I got to try and implement your tips the forum was down (luckily for me I had your response in an email from the forum, so could experiment) - but I got it working and wanted to thank you now that the forum is functioning properly again. I really appreciate it!

  • Like 1
Link to post
Share on other sites

Is it possible to drag and drop stuff or only possible to do that in code behind in #C.

 

https://docs.microsoft.com/en-us/dotnet/framework/wpf/advanced/walkthrough-enabling-drag-and-drop-on-a-user-control

 

Drag and drop is explained here: https://github.com/nicklikescoffee/UltimateUiPlugin/wiki/Drag-and-Drop

Link to post
Share on other sites
  • 2 weeks later...

Update V 1.11

 

Added
  • Change DataGrid Text Cell Value
  • Change DataGrid Image Cell Value
  • Change DataGrid Button Cell Value
  • Add DataGrid Header Click Event

The ability to run a command when the datagrid header is clicked means that you can implement a sorting algorithm for the datagrid. In the UltimateUI Demo folder that comes with the plugin you will see DataGrid With Sort Example to see a basic example of how to use Add DataGrid Header Click Event and sort a table.

  • Like 1
Link to post
Share on other sites

great update, if we do a table to datagrid, we cant add button element or images, will that be possible soon

 

I can possibly see an image that isn't clickable but how would the button work?

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...