UnderwareDESIGN

 Binary Tutor (Learn Binary )

   This little interactive program shows the same number in both binary and it's decimal representation.  The user can modify the individual bits (with the mouse) of the binary value and see how the changes alter the decimal result.


[pbcode]

; PROJECT : Binary-Tutor
; AUTHOR  : Kevin Picone
; CREATED : 1/10/2013
; EDITED  : 1/10/2013
; ---------------------------------------------------------------------


   Dim Bits(16)


   LoadFont "veranda",1,32
   LoadFont "veranda",2,16
   
   UnpackValueToBitsArray(16)

   setfps 50

   Do
      cls
      
      ThisValue=PackBitsArray()
      Draw_Binary_Bits(20,100,16,ThisValue)
      Draw_Value_As_Decimal(20,240,ThisValue)

      Sync
   loop esckey()
   
   end
      



Function PackBitsArray()
      For lp=0 to GetArrayElements(Bits())-1
            ThisValue|=lsl32(Bits(lp),lp)      
      next
EndFunction ThisValue


Function UnpackValueToBitsArray(ThisValue)

   Bits=GetArrayElements(Bits())-1

   For lp =0 to Bits
      Mask=2^lp
      Bits(lp)= ( Mask & ThisValue)<>0
   next   
   
EndFUnction


Function Draw_Value_As_Decimal(Xpos,Ypos,ThisValue)

   ThisFont=GetCurrentFont()
   Height=GetFontHeight(ThisFont)+4

   TExt Xpos,Ypos-(Height*1),"Decimal"

   setfont 2

   ThisFont=GetCurrentFont()
   Height=GetFontHeight(ThisFont)+4

   Text Xpos,Ypos,"%"+Right$(Bin$(ThisValue),16)+" = "+str$(ThisValue)+" Decimal"


   setfont 1

EndFunction


Function Draw_Binary_Bits(Xpos,Ypos,Bits,ThisValue)

   Static NextClickTime

   if NextClickTime<Timer()
      Mx=mousex()
      My=mousey()
      Mb=MouseButton()
   endif

   ThisFont=GetCurrentFont()
   Height=GetFontHeight(ThisFont)+4


   TExt Xpos,Ypos-(Height*2),"Binary [" +Str$(ThisValue)+"]"

   setfont 2

   Width=40
   Pad=Width*0.20
   ThisFont=GetCurrentFont()
   Height=GetFontHeight(ThisFont)+4
   Bits--
   Mask=2^Bits
   For lp =0 to Bits
   
      State= ( Mask & ThisValue)<>0

      HoverState=pointinbox(mx,my,Xpos,Ypos,Xpos+Width,Ypos+Height)
      
      Colour=$304050
      if HoverState
         Colour=$506070
      endif

      boxc Xpos,Ypos,Xpos+Width,Ypos+Height,true,Colour
      
      if mb
         if HoverState
               BitIndex=Bits-lp
               Bits(BitIndex)=1-Bits(BitIndex)
               NextClickTime=Timer()+200
               mb=0         
         endif                  
      endif
      

      Text xpos+1,Ypos-Height,Mask
      Text Xpos+1,Ypos+2,State

      Xpos=Xpos+Width+Pad
      Mask/=2
      
   next
   
   Setfont 1

EndFunction


[/pbcode]



Related Articles:

   * Point(x,y) - How RGB Colours Work / HEX / BINARY  (http://www.underwaredesign.com/forums/index.php?topic=927.msg7647#msg7647)

   * See Bin$() (http://playbasic.com/help.php?page=STRINGS.BIN$)

   * See Hex$() (http://playbasic.com/help.php?page=STRINGS.HEX$)

Thanks! Nice tutorial!

some binary operators would be cool too