Pages

Tuesday, May 29, 2012

Binary Multiplication

w7r.blogspot.com

Binary Multiplication is just like "regular" decimal (base 10) multiplication. The equations below are the four arrangements of binary multiplication of 1 bit. A bit is a binary digit.
  • 1 * 1 = 1
  • 1 * 0 = 0
  • 0 * 1 = 0
  • 0 * 0 = 0

Saturday, May 26, 2012

Top Rage Comic Compilation! #3

Top Rage Comic Compilation #3

Brought to you by W7R.blogspot.com

http://www.leragecomics.com/wp-content/uploads/2011/09/Fake-Nails-640x708.png

Friday, May 25, 2012

Simple Animations with JPanel’s Paint Method

Any instance or subclass of JPanel contains a repaint and paint method. The paint method can be used to draw content such as rectangles on to the JPanel. When you paint or draw objects on the JPanel you specify information such as the location and the width and height by means of parameters. For example to draw a rectangle you may use the syntax, graphics.drawRect(x,y, width, height);

Locations of objects are managed by having variables to describe them. The variable x, and y can store coordinates of the upper right hand point of an object we would draw/paint on the JPanel. The object location variables are important because they can be altered independantly of the rest of the panel. Changes to an object or shapes location are not displayed until paint or similar methods are called. Repainting of a JPanel can be triggered by minimizing and restoring the window that contains the JPanel.

By incrementing x or y variables the position at which a component is drawn will change. The old image is not wiped clean by the repaint or paint method implicitly. To repaint only the new image at its new location without leaving an imprint of the old one, you must repaint the background like so:
  1. Update x and y variables
  2. Repaint background
  3. Repaint the object with its new x and y values
In the following program two shapes, one rounded rectangle, and one oval are repainted to simulate movement on the computer screen. In this program sample the past images of the shapes are not removed. I did this to show you that cleaning of old drawings is not implicit with the repaint and paint method.
import java.awt.Color;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;

import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.Timer;

/*
 * W7R.blogspot.com
 * Brian R. H.
 */

public class MyPanel extends JPanel implements ActionListener{
 int ovalX=400,ovalY=400,ovalWidth=50,ovalHeight=30;
 int rectX = 200, rectY = 200, rectWidth = 20, rectHeight = 10;
 int rectDx=10,  rectDy=0; //change in Y
 int ovalDx=-20, ovalDy=0; 

 //        1 tick/second
 Timer clock = new Timer(1000,this);

 MyPanel(){
  setSize(800,600);
  clock.start();
 }
 @Override
 public void paint(Graphics g){
  //  paint occurs when the method repaint() is called (see actionPerformed method )
  Graphics2D g2d = (Graphics2D) g;
  g2d.drawRoundRect(rectX, rectY, rectWidth, rectHeight, 10, 10);
  g2d.setColor(Color.blue);
  g2d.drawOval(ovalX, ovalY, ovalWidth, ovalHeight);
 }
 public static void main(String[] args) {
  JFrame j = new JFrame("Title");
  JPanel p = new MyPanel();
  j.setContentPane(p);
  j.setSize(800,600);
  j.setVisible(true);
  p.setVisible(true);
 }
 private void updateVectors() {
  rectX+=rectDx;
  rectY+=rectDy;
  ovalX+=ovalDx;
  ovalY+=ovalDy;
 }
 @Override
 public void actionPerformed(ActionEvent arg0) {
  repaint();
  updateVectors();
 }
}

Sunday, May 20, 2012

Mouse Hover Effects with CSS


Hover over the link below! (Example 1)


Add W7R to your favorites!

The link above is a result of the code in the text area below. The text ":hover" is placed behind the id selector, #post, to indicate that all CSS styles in the following brackets should take place when the mouse is hovering over the element with the matching id, "#post".




 Add W7R to your favorites! 


We all have seen hover effects on links, but how about paragraph or divisions <div> like this text here. This phenomenum is made possible by using the ":hover" syntax following the selector we are using which in this case is "hovering". ":hover" is an example of a pseudo-property. Pseudo properties are attached to selectors to indicate that the selector has the block of CSS when that pseudo property applies. Other pseudo properties can be found here!




We all have seen hover effects on links, but how about paragraph or divisions <div> like this text here. This phenomenum is made possible by using the ":hover" syntax following the selector we are using which in this case is "hovering".

All elements of a webpage can be used like the link and paragraph did with the syntax below.


content


For more information please visit CSS :hover Selector

Introduction to CSS


An Introduction To CSS

It is recommended you understand HTML (DHTML, XHTML) before digging into CSS. CSS stands for Cascading Style Sheets and describes how a web page and its parts should be displayed. External style sheets are CSS files that can be implemented into any web page you desire. For example, a CSS file can describe how much indentation there should be in every paragraph <p> element.

Why web developers need CSS

The reason web developers need CSS is because HTML was never intended to provide visual properties to its components, but to instead inform web browsers of what element they were going to be displaying. Different web browsers display HTML in different ways (same for CSS). CSS separate the bones(HTML code) from the flesh (CSS).

Support for CSS

Have no fear! All web browsers support CSS so everything you learn about CSS will apply to a website viewed on any web browser, such as Firefox, Google Chrome, Internet Explorer, Safari, Opera, SimplePie.

Learning CSS Resources

W7R.blogspot.com currently has only a few lessons/posts on CSS, so I want to leave you with two great sites where you can study CSS.
  • Codecademy.com
  • w3schools.com

Wednesday, May 16, 2012

Getting Rid of Blogger's Navigation Bar



Making the Blogger navigation bar at the top of your site is easy! Follow the steps below and your blog will be squeaky clean in no time!

Getting Rid Of Blogger's Navigation Bar in 3 Steps
1. Get on your blogger account and go to "Layout". Select "Customize".
2. In Layout select the option labeled "Advanced". Then select the "Add CSS" tab.
3. Copy the code highlighted below into the text area. Press "Apply To Blog" to save the change.

#navbar-iframe {
height:0px;
visibility:hidden;
display:none;
}

Sunday, May 13, 2012

HTML Force Links to Open in New Tab


Sometimes, as a blog writer, it seems counter-productive for you to provide links to other websites and blogs that have similar or better content then your own; however, contrary to ones intuition, providing useful links from your site can build up an audience as well as a new post could.
In other words, sharing your resources with your audience will only benefit your blog or site. A thought crossed my mind after adding more links and resources to my blog. The thought was that when many people read content on the web clicking links to get more indepth information is inevitable, but most viewers do not intend to leave your page. So, I wanted the links on my site that appear in articles and posts to open in a new tab by default.
The knew there must be a way to force links to open in a new tab because you can right click any link and select "Open in new tab". So, after a google or two it was clear that one of the easiest ways to do this was by hiding the bar, instead of actually removing it all together. By using an attribute for the HTML anchor tag, <a>. Here's the original HTML code for a link to google (The first link would open and make you leave this page, but the 2nd link would open the page in a new tab.)

<a href="http://www.google.com/"> Go To Google </a>
Go To Google
<a href="http://www.google.com/" target="_blank"> Go To Google (new tab)</a>
Go To Google (new tab)

Thursday, May 10, 2012

The Substring Method of Java

Substring is a method/function used to select smaller strings in the String it was called on.

For example, "CatDog" is a string that contains two smaller strings, "Cat" and "Dog"
To break this "CatDog" string into the two seperate strings, "Cat" and "Dog" one would use the substring method.
Example #1:
//declaration and initialization of string1
String string1 = "CatDog";
 //prints out result of substring(2) 
System.out.println(string1.substring(2));
After running the code above you it is easy to realize we have a problem. Your console should read "tDog" which means we have not split the string1 up as we had planned. The reason is because the parameter we assigned to be 2 should have been 3. Below is the code for what we truly wanted. Goes to show that print statements are a good way to test/debug your programs!
String string1 = "CatDog";    //declaration and initialization of string1
System.out.println(string1.substring(2));    //prints result of substring(2) 
The first and only parameter in example one specified the first character of the string to start the substring from and then because there was no second integer parameter the method returned that first letter and all the characters that followed it in the string.
Example #2:
String quote = "code the gnar";
String word = quote.substring(1); 
System.out.println("original value: "+quote);
System.out.println("final value: "+word);
It is important to realize that there are more than 1 ways of calling for a substring() on a string. In the following example you will see an example using the substring(int,int) syntax. See if you can figure out what the 1st and 2nd integer paremeters are doing!
Example #3:
String alphabet = "abcdefghijklmnopqrstuvwxyz";
String letters = alphabet.substring(5,0); 
System.out.println("original value: "+alphabet);
System.out.println("final value: "+letters);

Click here to see the role of the 1st integer.
Starting index for the string

Click here to see the role of the 2nd integer.
How far after starting index to span

Friday, May 04, 2012

Top Rage Comic Compilation! #2

This is another of W7R's Top Rage Comic Compilations. Have a laugh and remember to check out W7R's other Top Rage Comic Compilation posts (see bottom of post)

Some More Lovely Rages (list #2)

Source
The following rage comics may elicit tears. As seen above!