Replace WPF Default UI Elements with Photoshop UI Elements - c#

I am new to Creating WPF GUI Applications.
I am a Mid Level Programmer. I dont have any idea or knowledge about the Graphics Development.
I would like to know how do I use the UI Elements designed in Photoshop in my WPF Application.
Eg: I would like to replace the default textbox or the button in WPF with the button or textbox designed in Adobe Photoshop.
Last Information:
I am using Expression Blend 4.
Any Help Would Be Appreciated, Thanks

Starting with WPF
I personally work with a combination of Microsoft Visual Studio (environment) and Microsoft Expression Blend (elements editing).
Blend is a WYSIWYG front-end for designing XAML-based interfaces for WPF and Silverlight applications, and it's good for templates, visual states, and animation.
Editing Templates
If you are working with templates, a nice tool is WPF Theme Editor by DevExpress. It integrates with Blend, and the tree browser and template hierarchy are very useful for locating styles.
One thing you'll always find helpful is access to the actual structural templates for the elements. I usually find myself visiting the DevExpress WPF Controls website, which has a very comprehensive list of libraries and controls.
The Demo Center for DevExpress is also a great downloadable app for extracting and editing templates. I find it particularly useful with complex elements like charts (not included in Blend), where you can toggle the visibility of elements and then move the code to your dev space.
Creating Graphics
For working with graphics themselves, I found Microsoft Expression Design to be quite good for drawing and exporting vectors into png, WPF or Silverlight formats. It has a nice simple set of tools, and you can import elements from vector. Also, version 4 is free.
Testing
I just discovered this nice tool for testing live called Snoop. It's open source, and it allows you to spy/browse the visual tree of a running WPF application (without the need for a debugger), and change properties live.
For all of these you will probably need at least a basic knowledge of how to write/read WPF. I personally use all of the previous and write custom styles for custom elements.

Related

Give application the same visual appearance as Visual Studio

This might be an easy one to answer as I'm probably just Googling for the incorrect search terms.
I'd like to change the visual appearance of my application to look more like the interface of Visual Studio 2013. Now with VS you can choose between three color themes (blue, dark and light). I'm trying to Google for ways that I can give my application that sort of look but any search for "theme" or "color theme" results in plenty of hits for how to choose a different color theme for VS.
I'm not so much interested in the colors as such but more the "flat" appearance for lack of a better word. Notice how my application has the standard Windows frame, standard minimize, maximize and close buttons at the top right and how the form's title bar, menu strip and tool strip are all different colors. On the Visual Studio UI, these are all one color and so appears to form a single unit. I also like how the form doesn't have any more border around it than is really necessary. The form basically consists of a "header" at the top (combined title bar, menu strip and tool strip) and a status strip at the bottom. Between those there is nothing but usable real estate, no silly border around the edge.
Is there an easy way to achieve this for my own applications?
This isn't possible with WinForms.
It's possible, but really really hard to achieve and not recommendable.
You need Windows Presentation Foundation.
Why?
First of all you need hardware acceleration. The UI in WPF is DirectX rather than GDI+ (WinForms) so it can make use of the acceleration and processing available in DirectX, and work in 3D.
Visual Studio it self is build with WPF.
If you want a fresh modern Look for your WinForms Application i would recommend Metro for WinForms (WinForms on steroids).
You also should look at ComponentOne Studio WinForms Edition. Maybe one of the 25 designed themes for WinForms suits you.
You need to use WPF for the same
https://msdn.microsoft.com/en-us/library/ms754130%28v=vs.110%29.aspx
https://visualstudiogallery.msdn.microsoft.com/7a4362a7-fe5d-4f9d-bc7b-0c0dc272fe31
For Screenshots:
https://github.com/firstfloorsoftware/mui/wiki/Screenshots

Resizable inner windows

I need to create multiple containers which can be freely moved and resized by the user (within the main surface of the app). Basically I need multiframe GUI.
I didn't find the existing control in the toolbox. So the question is: do I have to create my own control for this purpose (with monitoring and processing OnClick, OnMove and other events) or there are some other solutions?
What you're asking for is something like the scatterview available for Microsoft PixelSense on Samsung SUR40. Currently there is no predefined control for that. You can implement your own drag and drop, and in a very basic fashion this isn't hard. Look at the Reactive Extensions ( they do support Metro Style apps in the latest release: http://channel9.msdn.com/Shows/Going+Deep/Bart-De-Smet-Rx-Updat-NET-45-Async-WinRT ). They have a sample how to do it very simple and basic.
I do want to advise you to rethink your application concept. For being a great Windows 8 style UI app, you should avoid introducing ui concepts that differ too much from what other apps are using (or what Microsoft is asking you to follow in terms of guidelines). Depending on what you want to drag, it might be useful to work with filters and a listview to present the content along with that drill-down like navigation concept (hub-section-detail).
One side note: to avoid later confusion: you're not going to use WPF but XAML. There are differences in features how it's implemented.

In what language these are made

I have seen some applications having such a rich layout that a person starts hating desktop applications like traditional c#.I was wondering how to make applications having GUI like this is it possible to make it in c#?
According to the title, this uses WPF, which can be used with C# and/or XAML. It can actually be used with any .NET language.
The problem is not the programming language. What you need is:
a UI framework that allows rich layouts (in C#, you'd use WPF),
and, even more important, a designer. With "designer", I mean a human, not a tool. If you look at your screenshot, you will notice that the colors of the background image match those of the buttons, that the buttons match the content circle, that the header of the content circle ("Getting Started") matches the header of the window.
So, really, this is not a matter of programming language. What you need is a design. Implementing it is the easy part (at least with technologies such as WPF).
Look at the window title... "Xceed DataGrid for WPF Recource Center". I might be going out on a limb here, but I'm guessing that it was written using WPF and C#.
Only the developers know for sure! Okay, the window title gives it away
Quick guess, they're using Windows Presentation Foundation, which isn't a language, but part of the .NET Framework (starting with 3.0).
Adding some resources here . . .
You have to use WPF for that, and probably with some custom controls.
For WPF have a look here:
Wikipedia
MSDN
Expression Studio
For already made controls you can check:
Xceed
Infragistics
Devexpress
There are a lot more out there even a lot of free ones. All the above are commercial but i think they have a few free samples.

Are Visio-Like WPF GUI's possible?

I want to create buttons and displays in WPF that look something like the Visio Flow Chart displays. Are there classes for that?
Here's a series of articles which show you how to create a drag'n'drop flow chart designer in WPF:
http://www.codeproject.com/KB/WPF/WPFDiagramDesigner_Part4.aspx
The problem with that particular implementation (WPF Diagram Designer on Code Project) is that it is not MVVM based and generally doesn't use an architecture that is flexible or extensible to further development (e.g. just wanting to add Undo/Redo support would argue for a rewrite). It does, however, include a path finding algorithm (though in production use I fear it may be a little buggy).
I would recommend looking at the WpfDesigner.* assemblies in the SharpDevelop project (it's open source) and the WPF DrawTools on Code Project (http://www.codeproject.com/Articles/22776/WPF-DrawTools). The architectures of both of these are at least somewhat amenable to further development. Just ensure the licensing is compatible with your use, particularly for SharpDevelop.
I found http://www.codeproject.com/Articles/182683/NetworkView-A-WPF-custom-control-for-visualizing-a quite good. You would need to extend it with some UI templates to get the shapes you want and perhaps change the connector attachment scheme to fixed locations.

Designing WPF Windows for Free?

I'm starting a WPF project in a "free tools" environment. I'm currently working with the designer in Visual C# Express 2008, and directly with the XAML, both of which are very limited in design capabilities. My understanding is that Microsoft Expression Blend is not available for free (except for limited time trial).
Is Expression Blend expected to come out in a free Express version anytime soon? If not - are there any alternatives?
Thanks
No, there is no free version of expression blend (apart from the time limited trial), and there hasn't been any announcement of anything planned.
Several useful tools are:
Kaxaml and XAMLpad for testing blocks of XAML.
StyleSnooper allows you to grab the default styles/templates from all the existing controls in the framework. Very useful if you just want to modify an existing style or template a litte.
Also, reflector has a BAML plugin available which can come in handy at times.
We have expression blend (as part of an MSDN subscription) and we barely use it. We used to use it for 2 things. 1) To grab styles, we now just use style snooper, it's easier. 2) For testing custom templates of complex controls like list views, we have now re factored the architecture slightly to generate test data when the XAML is being displayed in visual studio so we don't have to switch to blend all the time.
I would only reccommend using Expression Blend if you are creating a very complex graphic or animation. For all other intents and purposes, stick with VS 2008. I have been studying WPF for about 3 months now, and I do not use anything other than Visual Studio. Even when I made a couple of games for my kids that had animations and the like, I didn't find the xaml editor to be at all limiting.
Of course, if you want a more light-weight xaml editor, check out Kaxaml. It's pretty efficient.

Categories

Resources