Recent

Author Topic: Ying Yang: Various ways to create it.Now I have ANIMATED it !  (Read 735 times)

Boleeman

  • Hero Member
  • *****
  • Posts: 902
Creating the Ying Yang symbol

Here is one way using ellipses/circles and pie
« Last Edit: April 19, 2025, 12:00:15 pm by Boleeman »

Josh

  • Hero Member
  • *****
  • Posts: 1372
Re: Ying Yang: Various ways to create it
« Reply #1 on: April 16, 2025, 11:16:28 pm »
using bgrabitmap and Antialias

Code: Pascal  [Select][+][-]
  1. const Const_DegToRad=3.141592654/180;
  2.  
  3. procedure TForm1.FormPaint(Sender: TObject);
  4. var Diameter,radius,halfRadius,x,y:single;
  5.     penwidth:single=5.5;
  6.     b:tbgrabitmap;
  7. begin
  8.   if width<height then Diameter:=width-penwidth else Diameter:=height-penwidth;
  9.   halfRadius:=Diameter / 4;
  10.   radius:=Diameter / 2;
  11.   x:=(width-Diameter) / 2;
  12.   y:=(height-Diameter) / 2;
  13.   b:=tbgrabitmap.Create(width,height);
  14.   //draw white circle
  15.   b.EllipseAntialias(x+radius,y+radius,radius,radius,clblack,penwidth,clwhite);
  16.   //draw half circle on right
  17.   b.FillPie(x+radius,y+radius,radius,radius,90*Const_DegToRad,270*Const_DegToRad,clblack);
  18.   //draw top circle
  19.   b.EllipseAntialias(x+radius,y+halfRadius,halfRadius,halfRadius,clblack,0,clwhite);
  20.   //draw bottom circle
  21.   b.EllipseAntialias(x+radius,y+halfRadius+radius,halfRadius,halfRadius,clwhite,0,clblack);
  22.   form1.Canvas.Draw(0,0,b.Bitmap);
  23.   b.free;
  24. end;
« Last Edit: April 16, 2025, 11:52:09 pm by Josh »
The best way to get accurate information on the forum is to post something wrong and wait for corrections.

Boleeman

  • Hero Member
  • *****
  • Posts: 902
Re: Ying Yang: Various ways to create it
« Reply #2 on: April 17, 2025, 01:41:33 am »
Wow Josh.

Looks nice and sharp. Using ellipses and pie.

I made another different version ( with the extra small circles) but it is much longer in code.


Wondered also if the Ying Yang symbol could somehow be done with XOR operations?


I have seen some cool Hypnotic animated Ying Yang animations done in other programming languages.

Thanks Josh for for that nice example
« Last Edit: April 17, 2025, 01:59:40 am by Boleeman »

Josh

  • Hero Member
  • *****
  • Posts: 1372
Re: Ying Yang: Various ways to create it. Possibly Animate it ?
« Reply #3 on: April 17, 2025, 03:35:02 am »
quick mod
setting invert color to flip it around
Code: Pascal  [Select][+][-]
  1. const const_pi=3.141592654;
  2.       Const_DegToRad=const_pi/180;
  3.       color1=clwhite;
  4.       color2=clblack;
  5.  
  6. var invertcolor:boolean=true;
  7.  
  8. procedure TForm1.FormPaint(Sender: TObject);
  9. var Diameter,radius,halfRadius,x,y:single;
  10.     penwidth:single=5.5;
  11.     b:tbgrabitmap;
  12.     drawcolor1:tcolor=color1;
  13.     drawcolor2:tcolor=color2;
  14. begin
  15.   if invertcolor then
  16.   begin
  17.     drawcolor1:=color2;
  18.     drawcolor2:=color1;
  19.   end;
  20.   if width<height then Diameter:=width-penwidth else Diameter:=height-penwidth;
  21.   halfRadius:=Diameter / 4;
  22.   radius:=Diameter / 2;
  23.   x:=(width-Diameter) / 2;
  24.   y:=(height-Diameter) / 2;
  25.   b:=tbgrabitmap.Create(width,height);
  26.   //draw white circle
  27.   b.EllipseAntialias(x+radius,y+radius,radius,radius,clblack,penwidth,drawcolor1);
  28.   //draw half circle on right
  29.   b.FillPie(x+radius,y+radius,radius,radius,90*Const_DegToRad,270*Const_DegToRad,drawcolor2);
  30.   //draw top circle
  31.   b.EllipseAntialias(x+radius,y+halfRadius,halfRadius,halfRadius,clblack,0,drawcolor1);
  32.   //draw bottom circle
  33.   b.EllipseAntialias(x+radius,y+halfRadius+radius,halfRadius,halfRadius,clwhite,0,drawcolor2);
  34.   //draw top eye
  35.   b.EllipseAntialias(x+radius,y+halfRadius,halfRadius/3,halfRadius/3,clblack,0,drawcolor2);
  36.   //draw bottom eye
  37.   b.EllipseAntialias(x+radius,y+halfRadius+radius,halfRadius/3,halfRadius/const_pi,clwhite,0,drawcolor1);
  38.   form1.Canvas.Draw(0,0,b.Bitmap);
  39.   b.free;
  40. end;
« Last Edit: April 17, 2025, 03:51:44 am by Josh »
The best way to get accurate information on the forum is to post something wrong and wait for corrections.

Josh

  • Hero Member
  • *****
  • Posts: 1372
Re: Ying Yang: Various ways to create it. Possibly Animate it ?
« Reply #4 on: April 17, 2025, 05:37:32 am »
corrected correct way

Code: Pascal  [Select][+][-]
  1. const const_pi=3.141592654;
  2.       Const_DegToRad=const_pi/180;
  3.       color1=clwhite;
  4.       color2=clblack;
  5.  
  6. var invertcolor:boolean=false;
  7.  
  8. procedure TForm1.FormPaint(Sender: TObject);
  9. var Diameter,radius,halfRadius,x,y:single;
  10.     penwidth:single=5.5;
  11.     b:tbgrabitmap;
  12.     drawcolor1:tcolor=color1;
  13.     drawcolor2:tcolor=color2;
  14.     adjX:single;
  15. begin
  16.   adjX:=penwidth/const_pi;
  17.   if invertcolor then
  18.   begin
  19.     drawcolor1:=color2;
  20.     drawcolor2:=color1;
  21.   end;
  22.   if width<height then Diameter:=width-penwidth else Diameter:=height-penwidth;
  23.   halfRadius:=Diameter / 4;
  24.   radius:=Diameter / 2;
  25.   x:=(width-Diameter) / 2;
  26.   y:=(height-Diameter) / 2;
  27.   b:=tbgrabitmap.Create(width,height);
  28.   //draw white circle
  29.   b.EllipseAntialias(x+radius,y+radius,radius,radius,clblack,penwidth,drawcolor1);
  30.   //draw half circle on right
  31.   b.FillPie(x+radius,y+radius,radius,radius,-90*Const_DegToRad,90*Const_DegToRad,drawcolor2);
  32.   //draw top circle
  33.   b.EllipseAntialias(x+radius,y+halfRadius+adjX,halfRadius-adjX,halfRadius-adjX,clblack,0,drawcolor1);
  34.   //draw bottom circle
  35.   b.EllipseAntialias(x+radius,y+halfRadius+radius-adjX,halfRadius-adjX,halfRadius-adjX,clwhite,0,drawcolor2);
  36.   //draw top eye
  37.   b.EllipseAntialias(x+radius,y+halfRadius,halfRadius/3,halfRadius/3,clblack,0,drawcolor2);
  38.   //draw bottom eye
  39.   b.EllipseAntialias(x+radius,y+halfRadius+radius,halfRadius/3,halfRadius/const_pi,clwhite,0,drawcolor1);
  40.   form1.Canvas.Draw(0,0,b.Bitmap);
  41.   b.free;
  42. end;
The best way to get accurate information on the forum is to post something wrong and wait for corrections.

Boleeman

  • Hero Member
  • *****
  • Posts: 902
Re: Ying Yang: Various ways to create it. Possibly Animate it ?
« Reply #5 on: April 17, 2025, 02:14:07 pm »
Animated version now created.

But I cant get rid of a tiny line.
« Last Edit: April 19, 2025, 12:01:33 pm by Boleeman »

 

TinyPortal © 2005-2018