August 2011 Archives - LearnToProgram.tv Archive

Archive for August, 2011

Learn C++ On the Mac: Hello World

Posted by Mark Lassoff on August 18th, 2011 | 3 Comments

C++ is one of the most common, and most important languages in use. For applications where speed is critical, C++ is often the best option. Since it is compiled in to machine language — unlike Java and .net languages which are interpreted — it runs extremely fast. C++ is often the top choice for creating video games and other graphic intensive applications.

In this first tutorial from the Learn C++ on the Mac series, Mark will review the basics of creating C++ applications on the Mac using XCode.

main.cpp:

#include <iostream>
 
 
//First program in C++ for Mac course
int main()
/*
	Main written by Mark Lassoff
	LearnToProgram.tv
*/
{
	std::cout << "Hello world from LearnToProgram.tv"<<std::endl;
	std::cout << "I am glad you are learning C++";
	return 0;
}

Javascript getElementById Tutorial

Posted by Mark Lassoff on August 15th, 2011 | No Comments

The Javascript getElementById method is, perhaps, one of the most important methods in the language. It allows you to access in HTML element that has an id attribute and value. Once you access the element you can manipulate its stylesheet, read its content, or change its internal HTML. In this tutorial Mark demonstrates the Javascript getElementById method and explains how you can use it most effectively.

The code created in this tutorial appears below.

Starting Code:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Understanding Get Element By Id</title>
</head>
<body>
    <div id="information">
        <p>Lorem ipsum dolor sit amet, <span id="highlight">consectetur adipiscing elit.</span> Donec egestas metus vitae ipsum feugiat quis euismod leo molestie. Curabitur egestas nulla enim. Sed pulvinar luctus risus, non dapibus purus porta ac. Vivamus eleifend ullamcorper ipsum et dictum. Mauris fringilla venenatis ante, et iaculis dolor faucibus at. Duis molestie pharetra ipsum eget elementum. Etiam dictum scelerisque tincidunt. Donec ut diam urna, non ornare nunc. Etiam a turpis ac libero feugiat accumsan a a nunc. Praesent vel orci in purus ornare convallis. In a arcu risus, eu egestas dolor. Sed bibendum posuere augue, congue sollicitudin lectus mattis eu. Maecenas in orci ac ligula tincidunt pharetra. Nulla at sem at lacus volutpat congue et eu mi. Maecenas lacinia viverra augue, a lacinia nisl vulputate ut. Duis in sollicitudin velit. Cras a mauris mi. Curabitur feugiat elit eget turpis facilisis porta. Suspendisse suscipit, lorem ut pulvinar dapibus, nibh lectus suscipit lacus, at accumsan enim neque vel arcu. Etiam luctus lacus vitae arcu hendrerit ullamcorper.</p>
    </div>
    <p>What do you think?
    <br/><input type="text" id="think">
    </p>
    <input type="button" id="change" onclick="changeContent()" value="Change Content"/>
</body>
</html>

Completed Code:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Understanding Get Element By Id</title>
    <script language="javascript" type="text/javascript">
    function changeContent()
    {
        document.getElementById("highlight").style.backgroundColor = "#990000";
        document.getElementById("highlight").style.color = "white";
        document.getElementById("information").style.border= "thin black solid";
        var textContent = document.getElementById("think").value;
        alert(textContent);
        document.getElementById("information").innerHTML = "<h2>This content has been changed dynamically with getElementById()";
    }
    </script>
</head>
<body>
    <div id="information">
        <p>Lorem ipsum dolor sit amet, <span id="highlight">consectetur adipiscing elit.</span> Donec egestas metus vitae ipsum feugiat quis euismod leo molestie. Curabitur egestas nulla enim. Sed pulvinar luctus risus, non dapibus purus porta ac. Vivamus eleifend ullamcorper ipsum et dictum. Mauris fringilla venenatis ante, et iaculis dolor faucibus at. Duis molestie pharetra ipsum eget elementum. Etiam dictum scelerisque tincidunt. Donec ut diam urna, non ornare nunc. Etiam a turpis ac libero feugiat accumsan a a nunc. Praesent vel orci in purus ornare convallis. In a arcu risus, eu egestas dolor. Sed bibendum posuere augue, congue sollicitudin lectus mattis eu. Maecenas in orci ac ligula tincidunt pharetra. Nulla at sem at lacus volutpat congue et eu mi. Maecenas lacinia viverra augue, a lacinia nisl vulputate ut. Duis in sollicitudin velit. Cras a mauris mi. Curabitur feugiat elit eget turpis facilisis porta. Suspendisse suscipit, lorem ut pulvinar dapibus, nibh lectus suscipit lacus, at accumsan enim neque vel arcu. Etiam luctus lacus vitae arcu hendrerit ullamcorper.</p>
    </div>
    <p>What do you think?
    <br/><input type="text" id="think">
    </p>
    <input type="button" id="change" onclick="changeContent()" value="Change Content"/>
</body>
</html>

How To Use CSS (Cascading Style Sheets)

Posted by Mark Lassoff on August 14th, 2011 CSS, Free, Mark Lassoff, web design, web development
| No Comments

Cascading Style Sheets are an important facet of web development. While HTML allows you to structure your web page, CSS allows you to create an impressive design.

This video tutorial on how to use CSS covers the basics of Cascading Style Sheets. At the beginning of the tutorial, Mark demonstrates how to place styles in the document head element. Later in the video Mark demonstrates the recommended method of placing CSS code in an attached .css file.

To help you learn how to use CSS, several types of CSS rules are demonstrated. Mark demonstrates several CSS rules that effect the typography and color of the text. Mark also shows you how to use CSS on both classes and ids and how you can use CSS to change a logical division.

All of the code developed for this tutorial on how to use CSS appears below.

howToUseCss.html

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>How To Use CSS</title>
    <link rel="stylesheet" type="text/css" href="example.css" />
</head>
<body>
    <h1>Welcome to Cascading Style Sheets</h1>
    <div id="first">
        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada <span class="highlight">fames ac turpis egestas.</span> Nulla quis magna nulla, eu scelerisque augue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse commodo ipsum eget diam egestas ultricies. Quisque massa nulla, ultricies eu bibendum id, ultricies et nulla. Curabitur ut sem metus, non mattis massa. Donec dictum molestie ipsum sit amet feugiat. Curabitur leo leo, aliquet feugiat sollicitudin id, lacinia vel eros. Donec convallis purus non felis ultrices tempus. Donec ullamcorper, enim sed placerat pellentesque, ante nunc porta dui, vitae blandit arcu massa vel lectus. Suspendisse nunc tellus, placerat quis placerat dignissim, blandit ac augue. Nulla vitae euismod lectus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec at eros tortor, nec fermentum massa. Aliquam eget magna sit amet mi imperdiet lobortis a nec orci. Vivamus ipsum nisi, fermentum nec imperdiet et, pellentesque et est.</p>
    </div>
    <p>CSS allows you to create well-designed web sites</p>
    <p class="highlight">This page was designed by Mark Lassoff, LearnToProgram.tv</p>
</body>
</html>

example.css

  p         {
                font-size: 11pt;
                font-family: arial, verdana, sans-serif;
                color: #cc0000;
            }
    #first  {
                background-color: #cccccc;
                width: 400px;
                padding: 10px;
                border: 2px solid green;
            }
.highlight  {
                background-color: yellow;
                color: black;
            }
        h1  {
                font-family: Georgia, serif;
                font-size: 1.5em;
            }

Android LocationManager Tutorial

Posted by Mark Lassoff on August 7th, 2011 | 3 Comments

In this Android LocationManager tutorial, Mark shows you how to create a location aware Android application. The application that you will create uses a GPS Provider to find the user’s current location and displays the latitude and longitude on the unit. As the user moves the Android LocationManager senses a new location. The LocationListener interface is used to code events that occur as the location changes, the location is unavailable or the location is established.

This Android LocationManager tutorial is designed to be a gentle introduction to the LocationManager class in Android. The LocationManager actually provides more information than simple latitude and longitude. For complete documentation the LocationManager see the Google Developers’ Reference.

[box type="warning"] A common mistake when attempting to complete this tutorial is forgetting to edit the Manifest.xml file. The fine location permission must be added to the manifest in order for this app to function. See the video for further information [/box]

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Latitude" android:id="@+id/textView1" android:textAppearance="?android:attr/textAppearanceSmall"></TextView>
    <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="" android:textAppearance="?android:attr/textAppearanceLarge" android:id="@+id/textLat"></TextView>
    <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Longitude" android:id="@+id/textView3" android:textAppearance="?android:attr/textAppearanceSmall"></TextView>
    <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="" android:textAppearance="?android:attr/textAppearanceLarge" android:id="@+id/textLong"></TextView>
</LinearLayout>

MGeolocationActivity.java

package com.learntoprogram.android;
 
import android.app.Activity;
import android.content.Context;
import android.location.Location;
import android.location.LocationListener;
import android.location.LocationManager;
import android.os.Bundle;
import android.widget.TextView;
 
public class MGeolocationActivity extends Activity {
 
	TextView textLat;
	TextView textLong;
 
 
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
 
        textLat = (TextView)findViewById(R.id.textLat);
        textLong = (TextView)findViewById(R.id.textLong);
 
        LocationManager lm = (LocationManager)getSystemService(Context.LOCATION_SERVICE);
        LocationListener ll = new mylocationlistener();
        lm.requestLocationUpdates(LocationManager.GPS_PROVIDER, 0, 0, ll);
    }
        class mylocationlistener implements LocationListener{
 
			@Override
			public void onLocationChanged(Location location) {
				if(location != null)
				{
					double pLong = location.getLongitude();
					double pLat = location.getLatitude();
 
					textLat.setText(Double.toString(pLat));
					textLong.setText(Double.toString(pLong));
 
				}
 
			}
 
 
			@Override
			public void onProviderDisabled(String provider) {
 
			}
 
			@Override
			public void onProviderEnabled(String provider) {
 
			}
 
			@Override
			public void onStatusChanged(String provider, int status,
					Bundle extras) {
 
			}
 
        }
    }

Archive for August, 2011

Learn C++ On the Mac: Hello World

Javascript getElementById Tutorial

How To Use CSS (Cascading Style Sheets)

Android LocationManager Tutorial

Pages

Archives

Categories

Blogroll

Meta

Subscribe

What is ?

New Android Book

On Learning