Page 1 of 1

RoundedBox

Posted: Fri Feb 10, 2012 6:11 pm
by Michael Vogel
Just made a simple procedure to create rounded boxes:

Code: Select all

Procedure RoundedBox(x,y,w,h,r,color)

	Box(x+r,y,w-r-r,h,color)
	Box(x,y+r,w,h-r-r,color)
	Circle(x+r+1,y+r+1,r,color)
	Circle(x+w-r-1,y+r+1,r,color)
	Circle(x+r+1,y+h-r-1,r,color)
	Circle(x+w-r-1,y+h-r-1,r,color)

EndProcedure
Does not look very useful? I just needed it to create icons for a calendar icon and the actual moon phase -> you can see both of them (but only today :lol:) in my wallpaper tool (hold shift to get back your previous wallpaper)

Here's a short snippet demonstrationg how I've created the smooth (transparent) box for the calendar icon...

Code: Select all

#ImageCalendar=1
#Image=200

Procedure RoundedBox(x,y,w,h,r,color)

	Box(x+r,y,w-r-r,h,color)
	Box(x,y+r,w,h-r-r,color)
	Circle(x+r+1,y+r+1,r,color)
	Circle(x+w-r-1,y+r+1,r,color)
	Circle(x+r+1,y+h-r-1,r,color)
	Circle(x+w-r-1,y+h-r-1,r,color)

EndProcedure
Procedure DemoBox(size,border,rand,type=0)

	Protected Zeile.s
	Protected nx,ny,nc
	Protected x,y,w,h
	Protected radius

	rand=30
	radius=100

	#NoTransparency=$FF000000
	
	#NormalWhite=$FFFFFFFF
	#DarkWhite=$FFE0E0E0
	#NormalBlack=$FF000000
	#LightBlack=$FF444444
	
	CreateImage(#ImageCalendar,size,size,32|#PB_Image_Transparent)
	StartDrawing(ImageOutput(#ImageCalendar))
	x=border
	y=0
	w=size-border<<1
	h=size
	DrawingMode(#PB_2DDrawing_Gradient|#PB_2DDrawing_AlphaBlend)
	GradientColor(0,#LightBlack)
	GradientColor(0.75,#NormalBlack)
	GradientColor(1,#LightBlack)
	LinearGradient(x,y,x+w,y+h)
	RoundedBox(border,0,size-border<<1,size,radius,#NoTransparency|#Black)
		
	x=border+rand
	y=rand
	w=size-(border+rand)<<1
	h=size-rand<<1
	DrawingMode(#PB_2DDrawing_Gradient|#PB_2DDrawing_AlphaBlend)
	ResetGradientColors()
	GradientColor(0,#NormalWhite)
	GradientColor((2+m)*0.25,#NormalWhite)
	GradientColor(1,#DarkWhite)
	LinearGradient(x,y,x+w,y+h)
	RoundedBox(x,y,w,h,radius-rand,#NoTransparency|#White)
	StopDrawing()

EndProcedure

OpenWindow(1,160,200,#Image,#Image,"",#PB_Window_SystemMenu)
SetWindowColor(1,#Blue)
DemoBox(#image*2,20,10)
ResizeImage(1,#image,#image)
ImageGadget(1,0,0,#Image,#Image,ImageID(1))

z=0
Repeat

	Select WaitWindowEvent()
	Case #WM_CHAR
		Select EventwParam()
		Case #ESC
			End
		EndSelect
	EndSelect
ForEver

Re: RoundedBox

Posted: Fri Feb 10, 2012 6:40 pm
by Trond
There's a new RoundBox() since lately:

Code: Select all

Procedure RoundedBox(x,y,w,h,r,color)
  RoundBox(x, y, w, h, r, r, color)
EndProcedure

Re: RoundedBox

Posted: Fri Feb 10, 2012 10:26 pm
by Michael Vogel
Trond wrote:There's a new RoundBox() since lately:

Code: Select all

Procedure RoundedBox(x,y,w,h,r,color)
  RoundBox(x, y, w, h, r, r, color)
EndProcedure
:oops:

Re: RoundedBox

Posted: Sat Feb 11, 2012 10:22 am
by Trond
:lol:

Re: RoundedBox

Posted: Sat Feb 11, 2012 2:08 pm
by yrreti
Michael Vogel,
Don't feel embarrassed by it. PB is changing, and it's easy not to notice all the improvements
or changes sometimes. But we appreciate your efforts and thanks for sharing your code.

Re: RoundedBox

Posted: Sat Feb 11, 2012 7:14 pm
by netmaestro
Don't feel too badly Michael, we've all been there! I once wrote a whole timepicker control not knowing that Windows already had one in the Date control, you just have to select the format:

http://www.purebasic.fr/english/viewtop ... 12&t=23797

I felt pretty stupid after that one :oops:

Re: RoundedBox

Posted: Tue Feb 14, 2012 8:03 am
by Michael Vogel
Thanks yrreti and netmaestro,
when getting older, someone has to learn dealing with such moments :)

Just to show, that it don't gave up, here's a later version of the transparent kalender symbol...

Code: Select all

Global OptCalendar=Random(1)

Global NowWeekdayLong.s
Global NowMonthNameShort.s
Global NowDayShort.s

Procedure CreateCalendar(size,slim,rand)

	Protected Zeile.s
	Protected nx,ny,nc
	Protected x,y,w,h
	Protected radius

	Enumeration
		#FontCalendarDay
		#FontCalendarInfo
		#ImageTemp
		#ImageCalendar
	EndEnumeration

	; resizing to 256x256
	radius=size>>3
	LoadFont(#FontCalendarDay,"Arial Black",-size>>1)
	LoadFont(#FontCalendarInfo,"Arial",-((9-OptCalendar<<2)*size)/37,#PB_Font_Bold)

	#NoTransparency=$FF000000

	#NormalBlue=$F00000;	no Transparency here
	#NormalRed=$0000F0;	no Transparency here
	#DarkRed=$FF0000D0

	#NormalWhite=$FFFFFFFF
	#DarkWhite=$FFD0D0D0
	#NormalBlack=$FF000000
	#LightBlack=$FF444444

	; outline...
	CreateImage(#ImageCalendar,size,size,32|#PB_Image_Transparent)
	StartDrawing(ImageOutput(#ImageCalendar))
	x=slim
	y=0
	w=size-slim<<1
	h=size

	DrawingMode(#PB_2DDrawing_Gradient|#PB_2DDrawing_AlphaBlend)
	GradientColor(0,#LightBlack)
	GradientColor(0.75,#NormalBlack)
	GradientColor(1,#LightBlack)
	LinearGradient(x,y,x+w,y+h)
	RoundBox(slim,0,size-slim<<1,size,radius,radius,#NoTransparency|#Black)
	StopDrawing()

	; inner elements...
	CreateImage(#ImageTemp,size,size,32|#PB_Image_Transparent)
	StartDrawing(ImageOutput(#ImageTemp))

	x=slim+rand
	y=rand
	w=size-(slim+rand)<<1
	h=size-rand<<1

	DrawingMode(#PB_2DDrawing_Gradient|#PB_2DDrawing_AlphaBlend)
	ResetGradientColors()
	GradientColor(0,#NormalWhite)
	GradientColor((2+OptCalendar)*0.25,#NormalWhite)
	GradientColor(1,#DarkWhite)
	LinearGradient(x,y,x+w,y+h)
	RoundBox(x,y,w,h,radius-rand,radius-rand,#NoTransparency|#White)

	x=slim+rand
	nc=#NormalRed
	If OptCalendar
		h=h<<1/7
		y=rand
	Else
		h=h<<2/11
		y=size-rand-h
		nc=#NormalBlue
	EndIf

	DrawingMode(#PB_2DDrawing_Gradient)
	ResetGradientColors()
	GradientColor(0,#NoTransparency|nc)
	GradientColor(0.7,#NoTransparency|nc)
	GradientColor(1,#NoTransparency|(nc*3/4));		Ecke abdunkeln
	LinearGradient(x,y,x+w,y+h)
	Box(x,y,w,h)
	StopDrawing()

	; combining layer...
	StartDrawing(ImageOutput(#ImageCalendar))
	DrawingMode(#PB_2DDrawing_AlphaBlend)
	DrawImage(ImageID(#ImageTemp),0,0)

	DrawingFont(FontID(#FontCalendarInfo))
	If OptCalendar
		Zeile=UCase(Left(NowWeekdayLong,8))
	Else
		Zeile=UCase(NowMonthNameShort)
	EndIf
	nx=TextWidth(Zeile)
	ny=TextHeight(Zeile)
	DrawText(x+(w-nx)>>1,y+(h-ny)>>1,Zeile,#NormalWhite,0)

	DrawingFont(FontID(#FontCalendarDay))
	Zeile=NowDayShort
	nx=TextWidth(Zeile)
	ny=TextHeight(Zeile)
	If OptCalendar
		y+(size-ny+h>>1)>>1
	Else
		y=(size-ny-h)>>1
	EndIf

	If OptCalendar
		nc=#NormalBlack
	Else
		nc=#DarkRed
	EndIf
	DrawText(x+(w-nx)>>1,y,Zeile,nc,0)

	StopDrawing()

	FreeImage(#ImageTemp)

EndProcedure

Procedure Main()

	#ImageSize=256

	Now=Date()

	Global NowWeekdayLong.s=StringField("Sonntag|Montag|Dienstag|Mittwoch|Donnerstag|Freitag|Samstag",DayOfWeek(Now)+1,"|")
	Global NowMonthNameShort.s=StringField("Jän|Feb|Mär|Apr|Mai|Jun|Jul|Aug|Sep|Okt|Nov|Dez",Month(Now),"|")
	Global NowDayShort.s=RSet(Str(Day(Now)),2,"0")

	OpenWindow(1,160,200,#ImageSize,#ImageSize,"",#PB_Window_SystemMenu)
	SetWindowColor(1,#Yellow)
	CreateCalendar(#ImageSize<<1,20,10)
	ResizeImage(#ImageCalendar,#ImageSize,#ImageSize)
	ImageGadget(1,0,0,#ImageSize,#ImageSize,ImageID(#ImageCalendar))

	Repeat
		Select WaitWindowEvent()
		Case #WM_CHAR
			Select EventwParam()
			Case #ESC
				End
			EndSelect
		EndSelect
	ForEver

EndProcedure

Main()

Re: RoundedBox

Posted: Tue Feb 14, 2012 11:49 pm
by electrochrisso
Don't feel too badly Michael, we've all been there! I once wrote a whole timepicker control not knowing that Windows already had one in the Date control, you just have to select the format:
Checked out the link NM, still some good programming examples in there man. :)

Re: RoundedBox

Posted: Mon Feb 20, 2012 2:17 pm
by yrreti
Michael Vogel
I sure don't need my glasses to see the date now :lol: :lol: :lol:
It looks nice. Thanks for sharing the code.

margaratehayes
Are you using PB4.61 purchased version?
Try recopying the code again in case it didn't grab it all, because it works fine on my
computer. Line 57 looks okay. I did modify the 'Repeat - Forever loop' part though,
so I could close it via the x box, as I'm used to doing it that way, and didn't notice the
ESC key until after playing with it. But that's a personal preference.

Code: Select all

  Repeat
    Select WaitWindowEvent()
    Case #WM_CHAR
      Select EventwParam()
      Case #ESC
        End
      EndSelect
    Case #PB_Event_CloseWindow
      CloseWindow(1)
      Break      
    EndSelect
  ForEver  

Re: RoundedBox

Posted: Mon Feb 20, 2012 5:47 pm
by c4s
@yrreti
I'm pretty sure that margaratehayes is a bot.

Re: RoundedBox

Posted: Mon Feb 20, 2012 11:21 pm
by yrreti
Thanks for the info c4s
I see even his post has been removed :!:
It's a shame we have to deal with people who do things like that, instead of using their skills
to help people instead. They are definitely getting more realistic, but I should have realized
that, since there was nothing wrong with that line of code it referred to.
Thanks

Re: RoundedBox

Posted: Tue Feb 21, 2012 1:02 am
by c4s
I agree, that bot was rather smart. Not one of those:
[...]Cheap shoes here click, here are shoes and hand bags and cheap shoes from PureBasic. Cheap PUREBASIC SHOES, SHOES. Get the shoes very cheap here. Quality shoes made of pure PureBasic, great quality! Click here [...]
:wink:

Re: RoundedBox

Posted: Tue Feb 21, 2012 9:57 am
by Michael Vogel
I'd like to show the actual results of the RoundedBox (and calendar) procedures above: Wallpaper Generator

It generates simple wallpapers showing some information, like user and computer name, IP address, date, events on a colored background...
Image

Re: RoundedBox

Posted: Tue Feb 21, 2012 11:23 am
by Little John
Great idea and looks very nice!

Regards, Little John

Re: RoundedBox

Posted: Tue Feb 21, 2012 12:00 pm
by electrochrisso
Good Shit!, Michael. 8)