The "What do you think of how my app looks" thread

[DeanMc]

Hey! you got your icons anyway, please for the love of all that is holy get rid of the black button though!

[chris128]

Just making a little instant messenger application to help me learn WCF and I thought I may as well brush up on my WPF skills while im at it. Its nothing fancy and I havent spent that much time on it but just thought I would post a few of the screens from it to add to the examples in this thread that people new to WPF can look at

Here's the sign in screen - this screenshot is taken from a Vista machine but the whole thing (including the buttons) looks identical on an XP machine



I'll post the chat screens and the main user list screen shortly

[Pac_741]

Just making a little instant messenger application to help me learn WCF and I thought I may as well brush up on my WPF skills while im at it. Its nothing fancy and I havent spent that much time on it but just thought I would post a few of the screens from it to add to the examples in this thread that people new to WPF can look at

Here's the sign in screen - this screenshot is taken from a Vista machine but the whole thing (including the buttons) looks identical on an XP machine



I'll post the chat screens and the main user list screen shortly

You should try to improve the color scheme, and work a little bit on the close button as it looks kind of bad, but anyways nice layout and great application.

[chris128]

Yeah the close button is kinda shabby in that screenshot as the image is compressed but honestly it looks a bit better in 'real life'. As for the colour scheme, I realise some people will think its a bit bland so I'm going to provide a couple of different 'themes' that users can select from, this is just the one Im working with while I build and test the app

[chris128]

Well I said several months ago that I would post the 'chat' screens from that instant messenger I'm making and I've finally got round to it lol



and the colours change based on the user's status. So if a user that you are chatting to changes their status to Busy then that green gets changed to blue. here is an example, when the user signs out and you still have the chat window open it will change to grey:




Oh and here is the main contact list screen (I've added a few things since I took this screenshot but its still pretty similar):

[dee-u]

chris128, aside from the black button that is cool! Care to share the code for that? =)

[chris128]

What black button? and which code do you mean, the XAML or the entire project?

[dee-u]

Oooppss, I was looking at your custom messagebox screenshot when I posteda quick reply, didn't realize this thread had two pages.

[chris128]

ah right haha fair enough I can post the source code + XAML for my custom messagebox if you want?

[dee-u]

I am particularly interested with how you manage to resize the form and limit it when the text grows longer than usual and instead wrap it, so I am kin at looking how you did it. =)

[chris128]

Well all that sort of stuff was done in XAML so here's the XAML code - this is for a slightly different colour scheme and title bar style than the one in the screenshots but same kind of thing. See attached file.

I guess the bits you are interested in are just using the TextWrapping property of the TextBlock, using WrapPanels, and using the SizeToContent property of the Window in combination with the MaxWidth and MaxHeight properties

[dee-u]

Thanks chris!

[Pac_741]

Here's a screenshot of a Point Of Sale Application I developed for a small supermarket: http://www.vbforums.com/attachment.p...1&d=1264209008

[chris128]

hey thats nice, I like the simple style it looks really good. Your text looks incredibly clear and crisp for a WPF application as well lol

[Pac_741]

hey thats nice, I like the simple style it looks really good. Your text looks incredibly clear and crisp for a WPF application as well lol

Thanks a lot Chris.

[chris128]

A few screenshots from an app I released recently that uses WPF 4:

[xera]

wow chris128, love those Ok and Cancel buttons.... How did you do them?! What do they look like when mouse is over, and pressed?

haha most of my apps so far look like they're from win95... but there is one revolutionary one, which has it's own whole skin, with curvy corners, shadow, etc that took me ages to create.

[chris128]

wow chris128, love those Ok and Cancel buttons.... How did you do them?! What do they look like when mouse is over, and pressed?

haha most of my apps so far look like they're from win95... but there is one revolutionary one, which has it's own whole skin, with curvy corners, shadow, etc that took me ages to create.

Cool, would love to see a screenshot of it

As for the buttons, they have a nice fading effect that makes them get a bit lighter when the mouse is over them and then they go darker and the content and background drops down a little when pressed.
I made them by using a border with a gradient brush as the background and CornerRadius set to 6 or something (to get the rounded corners), then another border on top that is invisible until the mouse is over it and then its opacity gets increased over about half a second Once I had made it all I just used the "Group Into Button" option or whatever it's called in Expression Blend. I can post the XAML for it (excluding the animations) if you want?

[akhileshbc]

Hi

Here's my contribution:

http://www.vbforums.com/attachment.php?attachmentid=83672&stc=1&d=1303803847

The background images are Photoshoped and this application is written in VB6.
The purpose of this application is to grab the results from my university's site (parsing HTML page) and can calculate some extra fields like Total, Percent, etc. and will create a shortened message with the result, which can be send as a text message.

[chris128]

you posted a VB6 app in the WPF forum

[akhileshbc]

you posted a VB6 app in the WPF forum

I'm focusing on the thread title: The "What do you think of how my app looks" thread

[chris128]

haha fair enough for a VB6 app I would say it looks pretty amazing! The only thing that lets it down for me is the column headings, they look a little bold and sharp compared to everything else that is quite smooth. Doesn't ruin it or anything but that's the only thing I'm not keen on

[akhileshbc]

haha fair enough for a VB6 app I would say it looks pretty amazing! The only thing that lets it down for me is the column headings, they look a little bold and sharp compared to everything else that is quite smooth. Doesn't ruin it or anything but that's the only thing I'm not keen on

Thanks

I couldn't find a good font at the time of development.
So, I have come up with that at the end. But the contents of the ListView is colored based on the marks(exam results) obtained. That is for a failed subject, it would color the row in red and for the rest, it will be in green.

I'm planning to release a new version in VB.Net. Will focus on clearing these issues and making it better.

I'm a fan of cool and modern GUIs. All those snapshots posted in this thread looks charming.

[NickThissen]

Well I've finally really started to work with WPF, and I must say it's a lot more powerful than I initially thought I thought it was all about the looks but the databinding is amazingly powerful...!

Anyway, I thought I'd share my test app here. It's a simple contact manager application, of which 39838523 (at the time of writing) already exists, but the point is to learn WPF so there

There's a lot of glass but I think it still looks pretty decent. The Toolbar is still crappy, as well as the 'group selection' combobox (I'm thinking of doing something completely different there; like a horizontal scrolling thingy where the user can scroll through groups and select one) which looks completely out of place. The blueish colors of the rounded rectangles aren't very nice either but I can't seem to find a color that suits... But I think it's not bad for a first try

I am using Expression Blend and VS at the same time though, I find in EB it is easy to select colors (obviously because you can see them change in real-time) and add borders around objects, but for some reason it doesn't seem to understand grid layouts. If I have a grid with two rows and want to place a border around an element in the second row, then instead of setting Grid.Row="1" on the border it adds a ridiculous Margin. It looks the same in the designer but it's not, and I have to go back and change it in VS each time. Am I doing anything wrong??

[chris128]

No you are not doing anything wrong, and I find VS usually does the same to be honest. It is annoying but I have learnt to just do all of my control creation and general layout stuff in XAML by hand, then just use the Belnd designer for things like picking colours and adding animations.

As for the look of your app, I like it other than the menu text being hard to see on the glass but I think you said you already plan on fixing that. I hope you can post another screenshot when it is completely finished

[akhileshbc]

Nice look, NickThissen

[NickThissen]

Here's an update. Still trying to figure out how to change the style of a ToolBar / Menu (I cannot figure out how to change the look of selected / hovering items) so for now I just gave them a slightly different color to make them stand out and make the text more readable.

I also removed the thick borders and removed some of the glass / transparency. Finally the lists also contain the contact images now, and the image on the 'edit contact' window looks a bit nicer too.

[akhileshbc]

How would these applications would appear in a XP machine ? Do you guys have some virtual PC to test this apps in WinXP OS ? Because there's some glass effect which makes the GUI cool. But in an XP machine, I think the glass effect portion might look bad.

[NickThissen]

In XP the background should be just white (though I didn't test it). Anyway, the purpose of my app is to learn WPF, so it's not going out to anyone anyway so I don't really care how it looks in XP

[akhileshbc]

In XP the background should be just white (though I didn't test it). Anyway, the purpose of my app is to learn WPF, so it's not going out to anyone anyway so I don't really care how it looks in XP

okay

[Lightning]

This is an app for Phone 7 devices, but the UI is created in WPF so I think I an allowed to post here It is still in the very first fase of development...

[chris128]

Nice though the screenshots are a bit big! :P

Oh and also, maybe its just me but I'd like to see the corners of those buttons rounded. But then I'm a sucker for rounded corners..

[Lightning]

The screenshots are the same as the MarketPlace screenshots (480x800).
The buttons will probably be rounded I think but this version needed the finished quickly so my customer could see that Phone 7 is the best choice
When the app is a little more finished I'll post more pictures

[chris128]

Ah I see, look forward to it

[NickThissen]

I'm creating a Calendar control similar to the Outlook calendar in month view. It's not finished yet, I still have to add appointments to it (but that shouldn't be too hard). I think it looks pretty good, and it was much easier than I expected I'm still having some trouble with triggers getting the day that the mouse is over to highlight, but I'll get that fixed soon enough I think, maybe with your help (there's a topic on it)


It works really well, all I need to do is supply it a month and a year and it shows the correct days, even those in the previous and next month that happen to fall in the first and last week of the shown month, just like Outlook does.

I'm not sure if I'm going to add week/day view, probably not as I don't need it at the moment, but I might need it in the future (well, I'm pretty sure I will but that's not for a long time) so I'll think about it.

[chris128]

Looking good! What is it made out of? Is it a listbox with a custom data template or more complicated than that?

[NickThissen]

No, much easier (but less 'correct' and less easily extendible I guess). The whole control is basically one grid. It has 7 columns and starts with just one row. Then it has a BuildCalendar method where I calculate the start and end dates based on the month it needs to display (in the case of the screenshot: may 29th and july 2nd). Then a simple loop increments the date by one each time and adds a new DayControl, which is a UserControl with a label (the header) and a ListBox (which will hold the appointments). For each control I increment the column and row and set them. When the column number reaches 6 I wrap around to 0 again and create a new RowDefinition in the grid (it has to be dynamic, for some months it displays 5 rows, for some months it needs 6 rows).

So yeah, pretty simple, but it works fine for me. The only thing I am not supporting is appointments spanning multiple days. That won't work with my approach since the appointments go into the ListBox in the DayControl; they'd have to go on top of all the DayControls in order to be able to span multiple days... But I don't need that anyway.

[chris128]

Ah I see, well yeah there's always more than one way to do things and whilst there is probably a and "more WPF" way of doing it, if that way works for you then its all good. Certainly looks the part anyway

[Lightning]

And an other Phone 7 app (also WPF), it displays the current location of the ISS and the orbit for the next hour:

[NickThissen]

Small update, appointments now show. You can choose different colors (I've implemented red, blue, green, yellow, white and black but a user can inherit AppointmentColor and return his own colors for the top and bottom of the gradient, text and border.

The small calendar on the right can be used to navigate to a certain date quickly; if you select a date there it is also selected in the month view calendar. This is not part of the month view calendar, I've implemented it in the main form.


I think the appointments look good, but the space is a little small (either that or the window has to be very large), so I am still experimenting with some methods to get the space larger. I've actually tried enlarging the selected day by a smooth animation. That worked in theory but it was awkward to work with; it was almost impossible to select the day you wanted because every time you move your mouse some days are enlarging and others are shrinking and you basically couldn't make sense of what you were seeing anymore