Custom Controls - how?

CryoGenID

Active Member
Licensed User
Hello!

I am just thinking of the best way of programming software for PPCs...
And so I have found Basic4PPC, the community seems to be extraordinary!!!

So what I really need to realize is custom controls,
e.g. something like the HTC-Home-Program (called "Manila"?!), so the buttons
should be able to have any shape, be possibly animated, etc.
Like this here:
httpx://expression.microsoft.com/en-us/dd279543.aspx

So that the GUI doesn't look at all like the "normal" WM-UserInterface...

And I need to create gauges, like these here (scroll down until "Feature Summary"):
httpx://www.quinn-curtis.com/QCRTGraphCFProdPage.htm
or here:
httpx://perpetuumsoft.com/GalleryCategory.aspx?lang=en&pid=36&category=Controls%20Library

I would be really happy if I could achieve this with Basic4PPC so that I wouldn't have to digg into "hardcore" C#-Programming using VS 2008.

Will I be able to do these things with Basic4PPC?
How complicated will that be (the custom controls and gauges)?

Thanks a lot in advance for your help!!!

Best regards,

Chris
 

Erel

Administrator
Staff member
Licensed User
You can draw controls yourself with the built-in drawing functions or with one of the image libraries. Note however that creating a complex control is not an easy task.
 

CryoGenID

Active Member
Licensed User
Erel,

thanks a lot for your quick answer :)

Is there any "manual" for creating custom controls?
Or is there sourcecode available for an application which uses
these libraries mentioned by you where I could learn from the sourcecode?
This application will be for my PHD-Thesis and so I have to find out what I can do within a certain timeframe ;-)

Thanks a lot for your help!

Best regards,

Chris
 

Erel

Administrator
Staff member
Licensed User
Can you attach an image with the design of the control that you want to implement?
 

CryoGenID

Active Member
Licensed User
Hello Erel!

Thanks a lot for your reply! :)

Yes for example I'd like to implement a control like this:
I would like to display the battery power like this here:


So the lights should light up representing the current battery status.
I would like to do this with some advanced, nicer graphics which could be
curved, etc.
e.g.:


Another thing I would like to try is something like this here:

So something like the black "List Item"-Control (Clickable)

Is there anything like a tutorial for those custom controls available?

Thanks a lot for all your answers and sorry for wasting your time with my questions but I'd like to be sure to use the correct environment for my
programming for my PHD-Thesis ;-)

Best regards,

Chris
 
Last edited:

RB Smissaert

Well-Known Member
Licensed User
Just a thought, but as you are short on time and it is a PHD-Thesis, why the emphasis on appearance?
From experience I know that these things can take up a lot of time.

RBS
 

CryoGenID

Active Member
Licensed User
Thanks for your reply!

Well part of the Thesis IS the graphical design :(
I first wanted to do it with Flash or something similar, but as I also has to have the needed functionality (Bluetooth-Access, etc.) I now seem to need to do it the "real" way: with real programming :(

Best regards,

Chris
 

Erel

Administrator
Staff member
Licensed User
As I see it the two first controls could be created without too much difficulties.

Creating a semitransparent control on the device will be difficult (will require an additional library for sure, and I don't think that such a library is currently available).
 

CryoGenID

Active Member
Licensed User
Erel,

thanks a lot for your reply!

Well I have decided to try it with Basic4PPC :)
Will now go to my Professor and ask him to buy Basic4PPC ;-)

I will surely be back at the forum with more questions later ;-)

Thanks to you all for your replies to this thread!

Best regards,

Chris
 

Cableguy

Expert
Licensed User
As a starting point (?) , you could check out my about panel control...
Its a full custon panel, with varioues controls, including an image and a button, with a sngle event....
 

agraham

Expert
Licensed User
Bare with me.....
:signOops:I don't think this means quite what you intended. I guess you meant "bear" :)

Actually I think he wants to write his stuff in Basic4ppc without writing a dll using Visual Studio or SharpDevelop.
 

taximania

Well-Known Member
Licensed User
Small example of using images as controls.
Fits perfect on 240 width device.
Doesn't show correct on desktop :(
 

Attachments

CryoGenID

Active Member
Licensed User
Thanks to you all for your help, comments, tips and tricks :sign0098::sign0098:

I have now bought Basic4PPC and will now start off and have a look at your
code and try to find out how I can use what I will learn from your source!

Thanks a lot and... I'll be back :D:D

Best regards,

Chris
 

CryoGenID

Active Member
Licensed User
Actually I think he wants to write his stuff in Basic4ppc without writing a dll using Visual Studio or SharpDevelop.
Hey, Agraham!

Well it would be perfect if I could use the "onboard"-Functions of Basic4PPC :)

But I will now have a look at the sources and come back with my questions :D

Best regards,

Chris
 
Last edited:

eww245

Member
Licensed User
For the Black List control. I would suggest using a screenshot of the current form,
then on a new form a lightened background to give a transparent effect with the control over top.
I think one of the image libraries could do it.
It would be alot eaiser than making a transparent form, which you would need VS for.
 

CryoGenID

Active Member
Licensed User
Hello everybody!

Well it has been a little bit quiet around this topic from my side as I have done a lot of playing around with different approaches, etc :)

And if I play around that always raises questions *g*, so here it is:
How can I "expand" a graphic?
Idea:
I have a graphic:

(is looks ugly now I know, but is just a proof-of-concept ;-) )
I would like to display the graphic part for part, e.g. start of with only
2px width, then in the next step display 2px more, etc.
Currently I am trying this with (using ImageLibEx):
B4X:
draw.DrawImage(bitmap.Value, RectSrc.Value, RectDest.Value, False)
RectDest.Inflate(2,0)
So in each step I am increasing the displayed rectangle with 2px.
Problem:
The image inside the RectDest is always completely visible and simply
gets streched with increase of the RestDest... How can I realize it
that I simply have a "peekhole" over the image which increases in
width?

Thanks a lot for any help from you :)

Best regards,

Chris
 

Cableguy

Expert
Licensed User
Load the image in full size into an image control, place a panel over it in the foreground, using the background color so that the image is covered... Then resize AND re-place the panel...

Example:
to show the 10% you panel has to start At the 10% position of the image, and still cover the rest of the image...
 
Top