[Q] How to implement Transparent Labels and other controls [vb.net] - Windows Mobile Software Development

I've been banging my head against this one all morning and now i have a head ache so i decided to stick it out to you lot.
I want to make all my user controls (labels, checkbox's etc) transparent - well the text at least. I found this thread on MSDN but i'll be honest and say i'm not entirely sure what i'm supposed to do with it.
Thanks for your thoughts.

Works a treat. Lifted the code from the site and dropped it straight into the form class.
Code:
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;
using Microsoft.WindowsCE.Forms;
namespace TestDevApp
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
forum.xda-developers.com/search.php?searchid=90851847
private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
DrawLabel(label1,e.Graphics);
DrawLabel(label2, e.Graphics);
DrawLabel(label3, e.Graphics);
DrawLabel(label4, e.Graphics);
}
private void DrawLabel(Label label, Graphics gfx)
{
if (label.TextAlign == ContentAlignment.TopLeft)
{
gfx.DrawString(label.Text, label.Font, new SolidBrush(label.ForeColor), label.Bounds);
}
else if (label.TextAlign == ContentAlignment.TopCenter)
{
SizeF size = gfx.MeasureString(label.Text, label.Font);
float left = ((float)this.Width + label.Left) / 2 - size.Width / 2;
RectangleF rect = new RectangleF(left, (float)label.Top, size.Width, label.Height);
gfx.DrawString(label.Text, label.Font, new SolidBrush(label.ForeColor), rect);
}
else //is aligned at TopRight
{
SizeF size = gfx.MeasureString(label.Text, label.Font);
float left = (float)label.Width - size.Width + label.Left;
RectangleF rect = new RectangleF(left, (float)label.Top, size.Width, label.Height);
gfx.DrawString(label.Text, label.Font, new SolidBrush(label.ForeColor), rect);
}
}
}
}
Devtrans is the view in VS
Transparent is the actual running code.

Cool thanks.
I did try using DrawString but the drawn text doesn't scroll with the form when you... well.... scroll the form.
I'm gonna have the afternoon off but i will check it out properly later. Would this also work for check boxes? If so what are the changes that would need to be made?

Checkboxes might be a different matter. The above method does not work, it only deals with the text caption. There is is an article on The Code Project at
http://www.codeproject.com/KB/dotnet/TransparentControl.aspx
It appears like they have almost created a control from scratch. You may have to take control/override that much of the object, to get it to work, that you have almost created a new control.

stephj said:
Checkboxes might be a different matter. The above method does not work, it only deals with the text caption. There is is an article on The Code Project at
http://www.codeproject.com/KB/dotnet/TransparentControl.aspx
It appears like they have almost created a control from scratch. You may have to take control/override that much of the object, to get it to work, that you have almost created a new control.
Click to expand...
Click to collapse
I did see that page but i couldn't figure out how the hell to use it

Ok, so now you have found one of the BIGGEST challenges to WM development.
I spent 4+ months trying to get the same thing you are looking for (well, what I assume you are looking for), that is: A transparent label that you can use your finger to scroll.
If that is what you are looking for, I can tell you right now that you need to either look into custom controls that already do this or decide how much time you are willing to invest into something as simple as that.
Here is the basic components that you will need to code to get DrawString to properly scroll with your finger:
You will need to code up some kind of container or panel that holds the current virtual x,y coordinates.
You will need to code up some kind of custom control that can be added to the previously made container
Create logic in the container to take the current virtual x,y coords and determine which custom controls are visible and should be drawn on the screen, pass them their offset coords, and draw the control
Override the OnMouse*ACTION* events on the container to manipulate the virtual x,y coords and then refresh the screen
You also will need to know about double buffering so you don't get any flickering.
It's a very very hard thing to do on WinMo, something that other platforms take for granted. This is one of the reasons that some custom WinMo programs have UIs that are either really terrible, or take tons of resources.
If you want to give it a go (and I would highly recommend doing it, I can't tell you how much I learned about software development by creating my own custom controls) I can help point you in the right directions. Feel free to take a look at the code I've written for my Facebook app (specifically the XFControls and SenseUI projects). I'm not on XDA as often as I'd like, but send me a PM with your questions and I'll respond when I log in.
Good Luck!

Related

Truetype fonts in evC++

Hi gents.
I want to ask you,how can I use external font loaded from ttf file in my app,developed under Embedded Visual C++?
I need to easily change color and size of the font and using the DrawText() function make an output into current DC.
Can someone make an example for me please?
Thank you.
Here's the bare bones of it ,you'll have to flesh it out to suit. It might not be perfect but it works.
Global Variable
Code:
HFONT g_hfont;
Forward declaration of EnumFontProc()
Code:
int CALLBACK EnumFontsProc(LOGFONT *lplf, TEXTMETRIC *lptm, DWORD dwType, LPARAM lpData);
In WM_PAINT print it out. I'll use Wingdings. The name in the EnumFonts must match the actual name of the font as declared in the TTF file.
Code:
case WM_PAINT:
RECT rt;
hdc = BeginPaint(hWnd, &ps);
GetClientRect(hWnd, &rt);
EnumFonts(hdc,TEXT("Wingdings"),(FONTENUMPROC) EnumFontsProc,NULL);
SelectObject(hdc,g_hfont);
DrawText(hdc,TEXT("12345"),5, &rt, DT_SINGLELINE | DT_VCENTER | DT_CENTER);
DeleteObject(g_hfont);
EndPaint(hWnd, &ps);
break;
In EnumFontsProc set the font to the first font given. Returning 0, ends the enumeration, non zero, give me the next.
To change the size do it here by changing lplf->lfHeight and lplf->lfWidth
Code:
int CALLBACK EnumFontsProc(LOGFONT *lplf, TEXTMETRIC *lptm, DWORD dwType, LPARAM lpData)
{
g_hfont = CreateFontIndirect(lplf);
return 0;
}
To load and release your font add the code below to the message handling sections.
Code:
WM_CREATE:
AddFontResource(TEXT("\\Storage Card\\myfont.TTF"));
WM_DESTROY:
RemoveFontResource(TEXT("\\Storage Card\\myfont.TTF"));
Here's the proof it works, (with Wingdings anyway!)
Thanks man,I will try it ASAP.
Well,is it possible to read the ttf file directly from exe resource also?
I am still learning C++,so some things are a bit unclear for me. Can you please post this source?
This stuff is explained fully at:
http://msdn.microsoft.com/en-us/library/aa911455.aspx
I've just taken a few shortcuts with it.
The zip file contains the main .cpp file of the above project. It does not include the AddFontResource or RemoveFontResource statements.
Create a shell WinMo application and replace the main program .cpp file with it.
AddFontResource can only accept the path to a True Type font TTF file as an argument.
The thing you have got to get your head around are CALLBACK routines, they are used during most enumeration routines, and are widely used in Win32 for all sorts of things. A Win32 app's WndProc it itself a callback routine. In the case of EnumFonts, you pass the address of the callback routine to the enumerating function, which will call your function once for every instance it finds that matches your request. You terminate the sequence by returning 0 or it will carry on until there are no instances left. You have to decide what to do with the results. In my case I take the first Wingding font I'm offered, then quit.
Be aware that there is little, or no error handling in this code. I cobbled it together pretty quickly to prove the point.
I remember reading somewhere that if you drop the .TTF file in the Windows directory, and do a soft reset, then Windows will pick it up as a resident font, so the AddFontResource and RemoveFontResource functions are not required. EnumFonts() should know about it, and present it accordingly.
Well,thank you very much for that,but can you please provide me full project source,including all the files? With working project,I can better understand the font loading principle.
Unfortunately,I am too busy nowadays to discover something,that I don't understand well,so every time save is a big plus for me. Thank you very much again.
Attached,
But, it is a VS 2008 Smart Device project. EVC won't read it.
You will have to create a shell hello world project in EVC and copy the modified code in the panels above from TestFont.CPP.
Hello.
Actually i've got it working,but I still cannot discover,how to resize the font.
Where should I exactly put the lfWidth and lfHeight?
I am now a bit confused of that.
This is my code:
Functions and declarations of HFONT,CALLBACK,WM_CREATE,WM_DESTROY are present as you described.
void ShowNumber(HDC hdc, int Value,int xrect,int yrect,int wrect,int hrect,HBITMAP source)
{
EnumFonts(hdc,TEXT("Sam's Town"),(FONTENUMPROC) EnumFontsProc,NULL);
SelectObject(hdc,g_hfont);
TCHAR szText[MAX_LOADSTRING];
int width,height;
rtText.right=wrect;rtText.bottom=hrect;width=wrect-xrect;height=hrect-yrect;
TransparentImage(hdc,xrect,yrect,width,height,source,xrect,yrect,width,height,RGB(255,0,255));
SetBkMode(hdc,TRANSPARENT);
if(Value<10) wsprintf (szText, TEXT ("0%d"),Value);else wsprintf (szText, TEXT ("%d"),Value);
rtText.left=xrect ;rtText.top=yrect ;SetTextColor(hdc,RGB(0,0,0)); DrawText(hdc,szText,2,&rtText,DT_SINGLELINE | DT_LEFT | DT_TOP);
DeleteObject(g_hfont);
}
int CALLBACK EnumFontsProc(LOGFONT *lplf, TEXTMETRIC *lptm, DWORD dwType, LPARAM lpData)
{
g_hfont = CreateFontIndirect(lplf);
return 0;
}
Click to expand...
Click to collapse
This doesn't work:
lplf.lfWidth=0;
g_hfont = CreateFontIndirect(lplf);
Click to expand...
Click to collapse
Actually I want to put one more parameter into ShowNumber() function,which will tell the function the size of the font.
You are nearly there...........
The code to set the font size will have to go in here.......
Code:
int CALLBACK EnumFontsProc(LOGFONT *lplf, TEXTMETRIC *lptm, DWORD dwType, LPARAM lpData)
{
lplf->lfHeight=14;
lplf->lfWidth=8;
g_hfont = CreateFontIndirect(lplf);
return 0;
}
Or whatever your values are, I just picked 8 and 14 as examples. If these values are passed as variables to another function above, store them as global variables, and use them here.
As lplf is passed to this function as a pointer to a LOGFONT structure, you have to use the -> operator to access its members. lplf.lfHeight won't work as you mentioned, that is for predeclared or static structures.
These values have to be changed here in the EnumFontsProc() routine before the font is created, as we are passing that pointer to create the font.
Good Luck!!
P.S. While we are here, let's tidy it up a bit.
Replace:
Code:
if(Value<10) wsprintf(szText,TEXT ("0%d"),Value);else wsprintf (szText,TEXT("%d"),Value);
with
Code:
wsprintf(szText, TEXT ("02%d"),Value);
A very big thanks for that.
I am still beginner in C++,so something can look very comic for others.
My beloved programming language is Pascal.
I really didn't think,that -> is an operator,I've just mentioned,you wrote it as something else(something like "to")
You are more than welcome.
Some features in C/C++ are not immediately obvious, but the real battle is fighting your way through the Win32 programming model, trying to get it to do what you want. Sometimes the simplest of things become maddeningly complicated, but the effort to do it properly is usually worth the effort.
Glad you got it working, best wishes, stephj.
Hello a bit later.
First of all,thank your for your explanation and now I am using this method successfuly.
I want to ask you now,if there is a way to get fixed pitch of the font,that is truetype. With standart font I can achieve with this...
lf.lfPitchAndFamily = (tm.tmPitchAndFamily & 0xf0) | TMPF_FIXED_PITCH;
I am using font,that displays numbers in "digital" mode(7-segment display) and I get the number "1" very narrow in comparison with others(actually it is narrow on any kind display,but is displayed on right segments,so "01" has adequate spacing on hard display). Now I get "0l_" instead of "0_l",that's not preferable.
Thanks in advance for reactions.
I don't think there the above method will work as each character has it own width associated with it.
A simpler approach, a bit of a pain, but which should work, is to draw/print the numeric value out one character at a time using DrawText(). Set a RECT structure up to hold the coordinates of the top left and bottom right of the area for each character.
Setting uFormat to DT_RIGHT will force the character to right align in the RECT area, so the '1' should appear correctly. Move the left and right values along a fixed amount for each character. A bit of trial and error will be involved first until you get the values just right.
Good luck, stephj.

[SDK] XFControls - Advanced UI SDK [UPDATED w/ Sense UI Example!]

This is an Advanced UI SDK for developing finger-friendly Application UIs.
The reason for developing this SDK was mainly to learn about programming for Windows Mobile and the Compact Framework 3.5. I also developed this SDK because I could not find good UI controls that gave total display control to the programmer while taking care of all of the Physics, windowing, and frame buffering AND was open source.
Finally, this SDK was originally developed as part of the XDAFacebook application that I am currently developing.
I am releasing this SDK and its source so that people can have a good foundation to build finger-friendly Windows Mobile applications, and so that programmers starting off in the Windows Mobile world won't have to start from scratch when creating useful UI Controls.
Here are some of the features and uses of this SDK.
Features:
Fully customizable
Easily create custom UI Controls
Resolution independent
Full physics for rendering smooth scrolling
Uses:
Quickly create UI controls
Develop full UI SDKs
Learn basic UI programming for .net CF 3.5
I ask that if you use these controls, please provide feedback so that everyone can benefit!
Thank you and I hope you find these controls useful!
SDK Documentation
Even though the controls are easy to implement, they can seem intimidating at first. Here is an over-view of the core pieces to the SDK:
The IXFItem Interface:
Here are Properties of the interface
PHP:
XFPanelBase Parent { get; set; } // The item's List container
XFItemState State { get; set; } /* An Enum to describe the current item's state
This could include things like [B]Selected[/B] or [B]Normal[/B]*/
Bitmap Buffer { get; set; } // This is the item's cache buffer. Allows for speedy rendering
XFItemStyle Style { get; set; } // CSS like style object. Allows for easy customization
XFItemType ItemType { get; set; } /* Enum to label the type of the current object.
For example, [B]Clickable[/B] or [B]Display[/B] meaning the item won't change*/
The following are the methods that need to be implemented
PHP:
int GetHeight(); /* This returns the height of the item. This value is usually calulated
but in some instances is static. The value should be cached because this method
is called several times during the rendering process.*/
void ResetHeight(); // What ever needs to be done to reset the height cache
void ItemPaint(Graphics g, int x, int y); // Where the magic happens. More on this later
XFItemClickResult GetClickResult(); // An enum is return with what the action of clicking this item was.
The main part of the interface is the ItemPaint method. This method is called from the XFPanelList and passes a Graphics object created from the Buffer Bitmap of the Item. In this method, you do all of your graphics logic, drawing it with the supplied graphics object. The x and y are any offset numbers that should influence when the objects are based. Most of the time, these numbers will be 0, 0.
Because the programmer has total control over how the item is rendered, special care must be used when creating the items, to draw all the features with respect to the XFItemStyle object. This object usually is created in CTOR. An example of the XFItemStyle object being created in one of the SenseUI XFItem's CTORs:
PHP:
public SenseItem()
{
ItemType = XFItemType.Clickable;
Style = new XFItemStyle()
{
BoarderBottomColor = Color.FromArgb(189, 182, 189),
DashStyleBottom = System.Drawing.Drawing2D.DashStyle.Dash,
TextColor = Color.Black,
TextFont = new Font(FontFamily.GenericSansSerif, 8, FontStyle.Regular),
SelectedTextFont = new Font(FontFamily.GenericSansSerif, 8, FontStyle.Regular),
SecondaryTextFont = new Font(FontFamily.GenericSansSerif, 7, FontStyle.Regular),
SelectedSecondaryTextFont = new Font(FontFamily.GenericSansSerif, 7, FontStyle.Regular),
SecondaryTextColor = Color.FromArgb(57, 52, 57),
SelectedTextColor = Color.White,
SelectedBackgroundColor = Color.FromArgb(43, 36, 43),
SelectedSecondaryTextColor = Color.FromArgb(182, 178, 182),
Padding = 11,
PaddingBottom = 12,
PaddingLeft = 10,
PaddingRight = 16
};
}
You will also notice that the ItemType is also set here.
How you use the Style is a little more involved. In the ItemPaint, the programmer should base all of the features off of what is in the Style object. Here is an example of how the above Style object was used in the ItemPaint method:
PHP:
public void ItemPaint(Graphics g, int x, int y)
{
int width = Parent == null ? Screen.PrimaryScreen.WorkingArea.Width : Parent.Width;
XFControlUtils.DrawBoarders(Style, g, 0, 0, width, GetHeight());
int currX = Style.PaddingLeft;
int currY = Style.PaddingTop;
int mHeight = 0;
int sHeight = 0;
if (Icon != null)
currX += _iconSize + Style.PaddingLeft;
SizeF mText = new SizeF();
if (!string.IsNullOrEmpty(MainText))
{
mText = XFControlUtils.GetEllipsisStringMeasure(width - currX - Style.PaddingRight, MainText, Style.TextFont);
MainText = XFControlUtils.EllipsisWord(width - currX - Style.PaddingRight, MainText, Style.TextFont);
}
SizeF sText = new SizeF();
if (!string.IsNullOrEmpty(SecondaryText))
{
sText = XFControlUtils.GetEllipsisStringMeasure(width - currX - Style.PaddingRight, SecondaryText, Style.SecondaryTextFont);
SecondaryText = XFControlUtils.EllipsisWord(width - currX - Style.PaddingRight, SecondaryText, Style.SecondaryTextFont);
}
mHeight = (GetHeight() / 2) - ((int)mText.Height / 2);
if (!string.IsNullOrEmpty(SecondaryText))
{
mHeight = (GetHeight() / 2) - _textSpace - (int)mText.Height;
sHeight = (GetHeight() / 2) + _textSpace;
}
if (State == XFItemState.Selected)
{
XFControlUtils.DrawBackgroundSelected(Style, g, x, y, width, GetHeight());
if (!string.IsNullOrEmpty(MainText))
using (SolidBrush b = new SolidBrush(Style.SelectedTextColor))
g.DrawString(MainText, Style.SelectedTextFont, b, currX, mHeight);
if (!string.IsNullOrEmpty(SecondaryText))
using (SolidBrush b = new SolidBrush(Style.SelectedSecondaryTextColor))
g.DrawString(SecondaryText, Style.SelectedSecondaryTextFont, b, currX, sHeight);
}
else
{
if (!string.IsNullOrEmpty(MainText))
using (SolidBrush b = new SolidBrush(Style.TextColor))
g.DrawString(MainText, Style.TextFont, b, currX, mHeight);
if (!string.IsNullOrEmpty(SecondaryText))
using (SolidBrush b = new SolidBrush(Style.SecondaryTextColor))
g.DrawString(SecondaryText, Style.SecondaryTextFont, b, currX, sHeight);
}
if (Icon != null)
XFControlUtils.DrawAlphaFirstPix(g, Icon, Style.PaddingLeft, Style.PaddingTop);
}
That is as complex as it gets. Other than doing normal Event Handling for ClickReturns, this is all that is required to create beautiful UI Controls for your application.
I hope that this helps! Feel free to PM me or post a reply if you need further clarification.
Class List
Form Controls:
XFPanelContainer - The main control that interacts with the Form.
XFPanels:
XFPanelBase - Basic building block. Handles most of the generic functionality
XFPanelList - Can add IXFItem items.
XFPanelHeader - The top header bar for an XFPanelContainer
XFItems
IXFItem - Interface that all XFItems inherate
XFItemSimpleText - Simple item that displays text
XFItemBack - Special item that allows a panel to slide back
XFItemLoading - Item that allows for work to be down in the background.
XFControlUtils: Library of static, useful utilities for this SDK
DrawAlpha - Draws an image with a supplied Graphics object with a specific level of opacity
DrawAlphaFirstPix - Draws an image and renders all pixels that are the same color as pixel (1,1) are 100% transparent
DrawJustifiedString - draws a justified string
GetEllipsisStringMeasure - Takes a string and if it is more than the supplied width, clips the string and adds a trailing "..." at the end
EllipsisWord - same as the GetEllipsisStringMeasure, except it ellipsis at the words and not at the char level.
GetSizedString - Takes a string and adds "\n" so that the string wraps according to the supplied width
Many Others!
Sense UI Example
Here is a working example. I made this Sense UI example in about 3 hours 15 hours. It isn't complete but gives a good example of how to/why use this SDK. There are 3 screenshots of what this demo looks like.
I'll explain some of the pieces of code when I get some time later today.
The other great example of how to use this SDK is the XFAFacebook Application.
The source for this project is located @ http://code.google.com/p/xda-winmo-facebook/source/browse/#svn/trunk/XFSenseUI
There are a few screenshots of the XDAFacebook application included.
Finally, a quick start tutorial.
Start a new Smart Device project.
Add a reference to the XFControls.dll
Place the following lines of code in the Form1 constructor (after the InitializeComponent()
Code:
XFPanelContainer container = new XFPanelContainer();
container.Dock = DockStyle.Fill;
Controls.Add(container);
XFPanelList list = new XFPanelList();
container.SetMainPanel(list);
list.ShowScrollbar(true);
for (int i = 0; i < 50; i++)
{
list.Add("This is item " + i);
}
Run the project and you will get an output like the "SimpleText.png"
It's that easy!
UPDATE: I've added the XFSense to the Google Code page and have made some pretty extensive updates to it. I've added a few controls including sliders, toggles, checkboxes and radio buttons. It still isn't complete but I will be working to make it a full fledge Sense SDK.
Stay tuned!
Releases:
Initial Release - 9/1/10
When major updates occur, the DLLs will be posted here. The best thing to do is pull the source from the Google Code page and use that.
This will guarantee the freshes code will be used for your projects
Instructions:
Download and unzip the latest XFControls.zip from below.
Add the .dll as a reference.
Program!
The source can be found at: http://code.google.com/p/xda-winmo-facebook/source/browse/#svn/trunk/XDAFacebook/XFControls
List of downloads:
10/6/10 - Updated for speed and better scrolling! - XFControls 0.2.zip
9/1/10 - Initial upload - XFControls 0.1.zip
Other things I might have missed
Reserved Other
Sounds interesting! Definitely looking forward to some screenshots.
kliptik said:
Sounds interesting! Definitely looking forward to some screenshots.
Click to expand...
Click to collapse
Screenshots are up!
Only 3 downloads?! Hmmm.... I figured more people would be interested in a finger-friendly and open source UI SDK...
Is there something wrong with my posts? Are they too confusing?
Let me know what I can do to help! This has taken me a good deal of time to write and I would hope that it would be of use to someone else...
joe_coolish said:
Only 3 downloads?! Hmmm.... I figured more people would be interested in a finger-friendly and open source UI SDK...
Is there something wrong with my posts? Are they too confusing?
Let me know what I can do to help! This has taken me a good deal of time to write and I would hope that it would be of use to someone else...
Click to expand...
Click to collapse
Just DL'd a copy. I'm super swamped at the moment trying to get the next release of KD-Font out, but I'll try and check this out when I get a chance.
Thank you for your contribution!
I will definitely give this a test run at some point. Good work!
you have to add you own graphics to this sdk?
janneman22 said:
you have to add you own graphics to this sdk?
Click to expand...
Click to collapse
yes, this is a UI SDK. it is used to create user controls. The core code handles all the caching and physics, but the programmer must create the actual controls. including the graphics. look at the sense UI example to see how you can implement your own custom UI controls. like i said in the post, it only took about 3 hours to create those controls. most of which was spent creating graphics.
joe_coolish said:
yes, this is a UI SDK. it is used to create user controls. The core code handles all the caching and physics, but the programmer must create the actual controls. including the graphics. look at the sense UI example to see how you can implement your own custom UI controls. like i said in the post, it only took about 3 hours to create those controls. most of which was spent creating graphics.
Click to expand...
Click to collapse
oh right. but does it place controls in the toolbox, or have you to create the controls hard coded?
i could help you to make some grapics packages for this sdk
Ok, I've updated the binaries to be the latest and greatest. The scrolling is super smooth and things are starting to look pretty good!
I also will be updating the XFSense and I'll probably be extending it a little more because I plan on bringing it into the XDA Facebook app.
As always, let me know what you think!
EDIT: Oh, and to answer the question about adding objects to the toolbox, I have not added the OCX files (or whatever they are) so that they can be added to the tool box. But, after you've added the container and the panels, everything is logic after that, so adding the items to the toolbox really doesn't benefit too much.
As far as graphics, I would love help with graphics! Send me a PM and we'll talk!
joe_coolish said:
Here is a working example. I made this Sense UI example in about 3 hours. It isn't complete but gives a good example of how to/why use this SDK. There are 3 screenshots of what this demo looks like.
I'll explain some of the pieces of code when I get some time later today.
The other great example of how to use this SDK is the XFAFacebook Application.
The source for this project is located @ http://code.google.com/p/xda-winmo-facebook/source/browse/
There are a few screenshots of the XDAFacebook application included.
Finally, a quick start tutorial.
Start a new Smart Device project.
Add a reference to the XFControls.dll
Place the following lines of code in the Form1 constructor (after the InitializeComponent()
Code:
XFPanelContainer container = new XFPanelContainer();
container.Dock = DockStyle.Fill;
Controls.Add(container);
XFPanelList list = new XFPanelList();
container.SetMainPanel(list);
list.ShowScrollbar(true);
for (int i = 0; i < 50; i++)
{
list.Add("This is item " + i);
}
Run the project and you will get an output like the "SimpleText.png"
It's that easy!
Click to expand...
Click to collapse
Very nice control. I downloaded the sample (had problem with missing XFControl project but downloaded it from code.google).
Have a couple questions, how would i go about adding image to a child panel?
What I'm trying to so is have about 75 items on the main screen and each item will have sub-panel, when clicking on sub-panel I need to have label x2 and image.
Also when compiling the project I get error:
"Error 1 'XFControls.XFPanels.XFPanelHeader' does not contain a definition for 'BackgroundImage' and no extension method 'BackgroundImage' accepting a first argument of type 'XFControls.XFPanels.XFPanelHeader' could be found (are you missing a using directive or an assembly reference?) C:\downloads\C#\XFSenseUI\XFSenseUIDemo\Form1.cs 39 24 XFSenseUIDemo"
Alright, I'll post an example if I get some time in a bit. But as for the error, it is because the Core XFControls has been modified since the last time I updated this thread. You can download the freshes code from the google code page or use the attached DLL. I'd suggest the Google Code page, since it gets updated more frequently. But then you get all the XDAFacebook with it, so it can also be negative.
Basically to add an image to an XFItem to be added to the XFPanelList, you can either create your own item by inheriting from the IXFItem and doing all the image manipulation in the ItemDraw() method.
For an example of how to do that, look at the XFItemImageDisplay item in the XFControls.XFPanels.XFPanelItems namespace.
If you need something specific, let me know and I'll see if I can whip up an example
I'm new to C# and the compact framework so sample would be good...
Thanks
JarekG said:
I'm new to C# and the compact framework so sample would be good...
Thanks
Click to expand...
Click to collapse
Ok, could you describe how you want the control to look? Also, what you want to supply to the constructor? IE a path for an image, upper text, lower text, maybe even some style things. ETC

[Q] [Resolved] [.Net CF 3.5] How do i create a treeview based file browser

I have a problem with a project i'm working on and that is:
How do i create a TreeView based file browser that can export a selected path and filename to a textbox and a Process.Start call at the same time. That's it in a nut shell. The main part if the tree view bit but i haven't figured out how to do variables yet and i'm gonna need one for the second part. I have spent hours googling and i have this question posted on a dedicated VB forum.
I'm using Visual Basic 2008 as the IDE and .Net CF 3.5 as the language (obviously)
If anyone has any ideas on this i'll gladly hear them coz i am really stuck. I found writting code to soft reset a device was easier
TreeNodeCollection tr=treeView1.Nodes;
TreeNode tn;
foreach (string dirs in System.IO.Directory.GetDirectories(System.IO.Directory.GetDirectoryRoot(Assembly.GetExecutingAssembly().GetModules()[0].FullyQualifiedName)))
{
tn = new TreeNode(dirs);
//tr = new TreeNodeCollection();
tr.Add(tn);
}
ergintiravoglu said:
TreeNodeCollection tr=treeView1.Nodes;
TreeNode tn;
foreach (string dirs in System.IO.Directory.GetDirectories(System.IO.Directory.GetDirectoryRoot(Assembly.GetExecutingAssembly().GetModules()[0].FullyQualifiedName)))
{
tn = new TreeNode(dirs);
//tr = new TreeNodeCollection();
tr.Add(tn);
}
Click to expand...
Click to collapse
Is that C# code or VB?
M3PH said:
Is that C# code or VB?
Click to expand...
Click to collapse
C#....VB don't have the curly brackets
So i've come back to this question after a few months avoiding VB. I'm now working on a new product and the lack of an folderbrowserdialog object in .Net CF is killing me.
What i need is this (oh and thanks to everyone that posted above but i can't make that solution work). A way to list all the folders on a device and then select one that can be passed to a variable so it's path can be used elsewhere. Maybe also pass the path to a textbox just so it's clear what you have selected. I've spent 2 days googling this and i did find a few things. Most don't work and the rest are in c# which is not much good. So if anyone wants to help me out i would really appreciate it.
Get your head round this.........
O.K. Here's how it's done, with a crash course in one of the most powerful of programming techniques - Recursion. It can confuse the hell out of rookie programmers, as they just can't get their heads round what's going on. It is dependant on a function's local variables and fortunately, .NET's stack based architecture allows us to use it to the full.
You will need, 1.) a TreeView object - named "treeView1" and 2.), a label named "label1" placed underneath it. The label is only there to prove the point that we can get at the full pathname of the selected directory in the Treeview. In reality it can be dropped, just put your processing code directly in the TreeView's AfterSelect() event.
The Form_Load() event gets the directories in the root directory, by calling GetDirList with an initial directory of "\".
GetDirList() adds the directories to the TreeView then calls GetDirList again on each directory to get any subdirectories, and again on each subdirectory, ad nauseum. Keep going until there are no more directories returned.
When completed TreeView contains a list of every directory/subdirectory on the device.
When you select an item from the TreeView the full pathname is displayed in the label. The image at the bottom shows it running under debug on the WinMo 5.0 emulator. There are several directories you would not normally see on your device.
Good Luck, stephj.
Code:
Private Sub Form1_Load(ByVal sender As Object, ByVal e As EventArgs)
Me.GetDirList("\")
End Sub
Private Sub GetDirList(ByVal PathName As String)
Dim dirs As String
For Each dirs In Directory.GetDirectories(PathName)
Dim tn As New TreeNode(dirs)
Me.treeView1.Nodes.Add(tn)
Me.GetDirList(tn.FullPath)
Next
End Sub
Private Sub treeView1_AfterSelect(ByVal sender As Object, ByVal e As TreeViewEventArgs)
Me.label1.Text = e.Node.FullPath
End Sub
P.S.
You will need the VB equivalent of using System.IO adding to your project.
This stuff has been around since .NET CF 1.1
The original project was written in C#, I used .NET Reflector to translate it into VB from the original. The original C# is included here:-
Code:
using System;
using System.Text;
using System.Windows.Forms;
using System.IO;
namespace Test
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
private void Form1_Load(object sender, EventArgs e)
{
GetDirList("\\");
}
private void GetDirList(string PathName)
{
foreach (string dirs in System.IO.Directory.GetDirectories(PathName))
{
TreeNode tn = new TreeNode(dirs);
treeView1.Nodes.Add(tn);
GetDirList(tn.FullPath);
}
}
private void treeView1_AfterSelect(object sender, TreeViewEventArgs e)
{
label1.Text = e.Node.FullPath;
}
}
}
cool thanks. I'll have a look at coding this tomorrow (i having some fun time right now).
I did have a look at doing this with a list box yesterday but i was getting errors left, right and centre so i really do appreciate the help.
Just an FYI the VB equivelent of "using" is "imports" otherwise most of the objects are the same but i don't nee to worry about adding it as the program is already interacting with the file system.
Again thanks very much. I really appreciate you taking the time to help me out.
I've just had a look at implementing this but i'm having trouble getting the treeview to populate with the folder list. What am i doing wrong? the object names all match up and i can't see why it's not working. Am i just being plain dense?
What i have Is pretty much what you posted except for a few changes to allow for the fact that the treeview object is in a tabcontrol and i already have a bunch of labels knocking around so the label is called label28 and not label1.
I'm sorry if it appears like i'm not trying or i'm asking you to do all the work but i am genuinely really stuck. I get the recursion principal, That's not an issue but i'm trying to create something from scratch that should really have been included in .net CF and i'm just not that good a programmer yet
Should work..... but without seeing the actual code it's rather hard to remotely debug it.
To prove the point, here's the complete VS2008 VB .NET CF 3.5 project.
In the \bin\release directory is the actual executable. If you have .NET CF 3.5 on your device, drop DirList.exe onto it and run it.
I had a look at the project you posted and just copied the coded over. I did make some tweaks so it only loaded the folder list when the tab the treeview was on was clicked but that didn't work so i repated the code in as is and voila! it works. Now all i need is to create a variable to store the selected path in but i think i can manage that.
Again a huge thanks.
Hierarchical view......
Here's the project to indent, compress, and expand the directory tree structure.
I was just playing around with this and i noticed that when you click on a directory below "\" the path becomes "\\this\path". This is obviously not a valid windows mobile path and it is causing an IOexception and I have no idea how to fix it. Google suggests lots of c# pages that say to use a regular expression to strip out the illegal characters but the example i found was for the entire path and it seemed to check each character against a variable of illegal values. I'm sure if that would work for me. Heres the link.
Let me know what you think.
I have no idea where the \\this is coming from, I can't replicate it.
To filter out the extra leading slash use this:-
Code:
Private Sub TreeView1_AfterSelect(ByVal sender As System.Object, ByVal e As System.Windows.Forms.TreeViewEventArgs) Handles TreeView1.AfterSelect
If TreeView1.SelectedNode.FullPath.Length() = 1 Then
Label1.Text = TreeView1.SelectedNode.FullPath
Else
Label1.Text = TreeView1.SelectedNode.FullPath.Substring(1)
End If
Interesting new problem has cropped up with this code. It doesn't seem to work on rhodiums. It works fine in the emulator, my HD2 and all of CajunFlavouredBob's devices but i have a user that has a rhodium that get the error posted here. I can't replicte it and i don't have a rhodium to test it with. Any ideas?
Hmmmmm another tricky one. Without seeing the device actually throw the error, it can be a bit difficult.
Does this machine actually report the storage card as "\Storage Card"? Some machines don't. In which case you may have to use some storage card enumeration trick to get hold of the real name it uses. This may not apply in this case.
Also, to make things trickier still, the stack dump shows 'GetInternalDirectoryNames()' as the function throwing the error first. This is a level below your call of GetDirectories(), and is being used by the OS to actually go get the info. You may have to create a test version of EXCT2 full of Try...Catch programming blocks, to try to get to the real point where the error is being thrown.
well this turned out to be a memory related issue. So instead of using the folder browser we now use the stock winmo savedialog. because it uses less memory and allows us access to the locations we need.
Thanks for helping though steph.

[Q] Dynamic UI Creation XAML, C#

this is my first post. I am pretty desperate at the moment.
I would like to dynamically create the UI for the WP7 based on a CSV file in Isolated Storage. right now I would settle for just being able to write the UI in XAML from the code behind in C#.
steps that I would like to execute:
1. user clicks a muscle group button which passes a value to another page-done
2. users data is pulled from CSV file and placed in array for easy storage-done
3. for each data element create a XAML TextBlock with the data which is displayed in the UI <-- need some serious help
best I can do is show the XAML code with the <> tags as a string in the UI.
is what I am asking possible?
Thanks for helping.
Knudmt said:
this is my first post. I am pretty desperate at the moment.
I would like to dynamically create the UI for the WP7 based on a CSV file in Isolated Storage. right now I would settle for just being able to write the UI in XAML from the code behind in C#.
steps that I would like to execute:
1. user clicks a muscle group button which passes a value to another page-done
2. users data is pulled from CSV file and placed in array for easy storage-done
3. for each data element create a XAML TextBlock with the data which is displayed in the UI <-- need some serious help
best I can do is show the XAML code with the <> tags as a string in the UI.
is what I am asking possible?
Thanks for helping.
Click to expand...
Click to collapse
Sounds like what you really want to do is dynamically create controls in the code-behind. I would forget about generating "XAML".
Code:
private void AddTextboxesFromCSV(string[] CSVData) {
foreach(string str in CSVData) {
TextBlock tb = new TextBlock();
tb.Name = "txtUserSelectedValue" + CSVData.IndexOf(str);
tb.Text = str;
<YourObject>.Controls.Add(tb);
}
}
Where <YourObject> is the object you want to place the controls into, some sort of layout Panel.
Thanks for the response
I think that is the direction I will be going. Just out of curiosity do you know if what I wanted to do is even possible?
UN app for WP7 does something like this. Go to http://unitednations.codeplex.com/releases/view/57722 and grab the source. Open the source in Visual Studio and browse to the "Framework" folder and open up "BasePage.cs". At the bottom there's a method called AddNavigatingText() that does what I think you are looking to do.
Here's the method:
Code:
protected Grid AddNavigatingText()
{
var NavigatingText = (Grid) XamlReader.Load(
@" <Grid xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation""
xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml"" Height=""30"" VerticalAlignment=""Top"" Background=""#CCFFFFFF"">
<TextBlock HorizontalAlignment=""Left"" TextWrapping=""Wrap"" Text=""Navigating..."" Width=""129"" FontSize=""{StaticResource PhoneFontSizeNormal}"" Margin=""24,0,0,0"" FontFamily=""{StaticResource PhoneFontFamilySemiBold}""/>
<ProgressBar Style=""{StaticResource PerformanceProgressBar}"" RenderTransformOrigin=""0.5,0.5"" Margin=""135,0,0,0"" UseLayoutRounding=""False"" Background=""White"" IsIndeterminate=""True"" LargeChange=""0"" />
</Grid>");
this.Content.As<Grid>().Children.Add(NavigatingText);
return NavigatingText;
}
Thanks for the reply. Looks pretty simple. I downloaded the source and signed up for codeplex. However I can not connect to the tfs.codeplex.com
It's not possible to use dynamically created XAML; code is the way to go and much easier IMHO.
When you open the project just hit cancel at the login screen and it will load.
sulphuricaciduk said:
It's not possible to use dynamically created XAML; code is the way to go and much easier IMHO.
Click to expand...
Click to collapse
Agreed, doing it via code with a very basic XAML based page is likely to be faster, and will actually work. It's also a lot easier to fix things than trying to work out what went wrong in XAML you can't see...
I would agree with the statement that creating the controls dynamically would be faster. And def a great deal easier to read It just bugs me when I know this can be accomplished, yet I cant get it to work
Blade0rz said:
Sounds like what you really want to do is dynamically create controls in the code-behind. I would forget about generating "XAML".
Code:
private void AddTextboxesFromCSV(string[] CSVData) {
foreach(string str in CSVData) {
TextBlock tb = new TextBlock();
tb.Name = "txtUserSelectedValue" + CSVData.IndexOf(str);
tb.Text = str;
<YourObject>.Controls.Add(tb);
}
}
Where <YourObject> is the object you want to place the controls into, some sort of layout Panel.
Click to expand...
Click to collapse
Well that worked very well, thanks! I am having a little formatting issue .. my textblocks show up right on top of each other. any ideas?
Thanks again
Knudmt said:
Well that worked very well, thanks! I am having a little formatting issue .. my textblocks show up right on top of each other. any ideas?
Thanks again
Click to expand...
Click to collapse
I solved this silly issue. just added a listbox control to the xaml front end and added my elements with an ugly cast
listbox1.items.add((TextBlock)myBlock);
Knudmt said:
I solved this silly issue. just added a listbox control to the xaml front end and added my elements with an ugly cast
listbox1.items.add((TextBlock)myBlock);
Click to expand...
Click to collapse
If you had a StackPanel as the parent control, you could have each new textblock stacked...

[Q] NavigationService and form controls

I have a main form with a load of controls on it. I have a listbox, and a piece of code that is looking at individual items eg:
Code:
dim listitem as listboxitem = me.listbox.item(0)
when i use the navigationservice.navigate function to navigate to a different page, and then navigate back to the main page i can no longer edit that list box. The code still runs and doesnt error, but the list item is not updating. Its almost like there are two instances of the form open.
Any ideas?
thanks
when im navigating back to the main form i am using another navigationservice.navigate. Im guesing this is creating a new form everytime you use the .navigate as when i use navigationservice.goback from the second form it works fine.
To that end, is there a way you can close a form once you have navigated away from it using .navigate? and can you navigate to an already open form (without creating a new instance) and without using .goforward?
thanks (im using vb silverlight by the way)
adamrob69 said:
... i can no longer edit that list box. The code still runs and doesnt error, but the list item is not updating. Its almost like there are two instances of the form open.
Click to expand...
Click to collapse
Hmm... Could you explain what do you mean? How do you "edit" list box?
Post your code and explain what are you trying to do.
P.S. Have you tried to trace your code with breakpoints on the page constructors? Just try - you will be very surprised
Code:
''MainForm
sub EditListBox()
dim listitem as listboxitem = me.listbox.item(0)
listitem.content = "New List Text"
end sub
sub Navigate()
NavigationService.Navigate(new uri("/Page2.xml",relative))
end sub
Code:
''Form 2
sub NavigateBack()
NavigationService.Navigate(new uri("/MainForm.xml",relative))
end sub
The EditListBox() routine is called every x mins from a system timer. When navigated to form2 then back again the code still runs, i can put a break in and can see it running through the code but the listbox isn't updating. I believe this is because when you use the NavigationService.Navigate function it creates a new instance of the page. On form2 if I use NavigationSevice.GoBack instead of .navigate the main form updates the listbox correctly.
So if that is the case; is there a way you can close a form once you have navigated away from it using NavigationService.navigate? and can you navigate to an already open form (without creating a new instance) and without using .goforward?
I've already gave you a hint (to debug constructors). Yes, if you are using NavigationService.Navigate(new Uri("/MainPage.xaml", UriKind.Relative)); or NavigationService.Source = new Uri("/MainPage.xaml", UriKind.Relative); it creates a new page.
This implementation have a sense if you start thinking in web-based terms (what is Silverlight built for!)
BTW, I don't understand your requirements. Why do you need this? What's wrong with GoBack() or GoForward()? Also, have you tried other WP7 layouts (Panorama etc.)?
Try to follow the MS "Metro UI" recommendations and many questions will disappear shortly...
GoFoward won't work:
http://msdn.microsoft.com/en-us/lib...ation.navigationservice.goforward(VS.92).aspx
It seems like your problem isn't navigation, (because you should be using GoBack) but that the previous page that you GoBack to isn't how you wanted it.
If this is the case, you should add some sort of way to tell an event occurred. For example, if you did (note this is really rough)
Page2.xaml.cs
{
...
public static bool VisitedPage = false;
...
}
and when you visit the page, simply set it to true.
Then, when you GoBack, in OnNavigatedTo
protected override void OnNavigatedTo(NavigationEventArgs e)
{
if (Page2.VisitedPage)
{
//process why you needed to go tot he page
//clear the page for a fresh run
}
}
Have you tried unselecting that listbox item when you goback?
I had this same issue not too long ago where since it was the same instance of the page the listbox item was still selected when I returned and since the event on the listbox is "selectedchanged" it doesnt change when you select the same 1.

Categories

Resources