Creating 2d game engine for android OS,Building The Engine Process , android tutorials ,

Building The Engine Process:
Phase 1: Setup ArrowGame Project on Eclipse
1. Start Eclipse and select “Android Application Project”

2. Fill out the Wizard form as shown below:
a. Application Name: ArrowGameEngine
b. Project Name: ArrowGameEngine
c. Package name: com.marist.arrowgameengine

3. Click next at the Configure Project Window
4. Click next at the Configure Launcher Icon. (We can set this later)

5. Select “Blank Activity” on Create Activity and Click Next

6. Name the Activity “ArrowGame.” Click Finish

Creating 2d game engine for android OS, Structure of Our Sample Engine, android tutorials ,

Structure of Our Sample Engine:

  ArrowGame.java -> Holds the Control. Listens to the Gestures from the screen and then calls methods from the View to update Actor Positions

Data Elements:

Private Instance of ArrowGameView arrowGameView

Instance of Gesture Detector

Private inner class of SimpleOnGestureListener

ArrowGameView.java -> Holds the View and the Game Logic Loop. Also Holds the “cast” of Actor instances that will take part in the Game.

Data Elements:

Public Instance of Actor archer

Public Instance of Actor arrow

Public Instance of Actor balloon

Private Handler h

Private constant int FRAME_RATE = 30

Actor.java -> This data structure will model the “characters” in the game.

Data Elements:

Private Context context

Private int x

Private int y

Private String name

Private int costume

Private int currentCostume

Private Array BitMapDrawable[] graphic

res/drawable: 

        These characters should be provided for download later.

archer.png

arrow.png

blueballoon.png

drwho.png

popballoon.png

tardis.png

activity_arrow_game.xml:

        Holds the XML code that will control the layout of the View

ok Friends this was the android game engine for android OS tutorial hope you people like it. stay with us for next tutorial.

NOTE : Dear Readers if you have any query/question feel free to ask me via comment box given below. Also Follow us on social media site and share that post with your friends. - See more at: http://onlinecomputercafe.blogspot.com

Creating 2d game engine for android OS,Control-Model-View , android tutorials,

Control-Model-View

In mobile device programming, the Control-Model-View (CMV) metaphor for software design allows the programmer to model the user input, logic, and animation/output for their game, animation, or simulation. The CMV metaphor as related to Java-Android is as follows:

Control: 

Represents the “user” input and timed events within the software game. By design, Android programming is event driven. The user touches the screen,  shakes the phone, presses a button and the software responds with an action. In the structure of an animated game, usually a timer will trigger animation events 30 times a second in addition to user input. In the structure of an Android program, the Control is the “Main Activity” that first opens on execution of the program.

Model:

Represents the data structure of the objects and the functions that govern the flow of logic and action in a game. I think of the model in two parts:

1. The actual game pieces as modeled in classes.
2. The actions of the game pieces in relation to movement and each other. (Functions)
3. The “Game Logic.” (Rules of the game)

In Android software development, the Model can be a separate Class that “holds the objects and action” or the Model can be interwoven within the View Class.

View:

The View’s job is to retrieve positions, orientation, data, and graphics from the Model and draw them on the Screen.  The Runnable and the Handler will call events 30 times a second that causes the view to retrieve this data and then draw the  image to the screen. In Android Programming the View is usually represented as a “GameView.java” class that extends the Android class of View.  The View holds the “Game Loop” that calls on the Model to update the positions of the game.

This is very important tutorial of android gaming please comment in comment box below.

ok Friends this was the android game engine for android OS tutorial hope you people like it. stay with us for next tutorial.

Dear Readers if you have any query/question feel free to ask me via comment box given below. Also Follow us on social media site and share that post with your friends. - See more at: http://onlinecomputercafe.blogspot.com

Creating 2d game engine for android OS, android tutorials

Note : Today we are going to start our new tutorial about android game engine. this tutorial is very important for android game developers.

Creating 2d game engine for android OS

Introduction:

This tutorial will lead you through the foundations of creating a 2D animated game for the Android Operating System. The goal here is not to create a complex, multilevel game. Rather, the goal is to create and understand within the elements of the Control-Model-View method of game software design. In addition, we will create this engine from “scratch” – meaning that we will code every aspect of the game in Java with Eclipse to gain a deeper understanding to the interplay between classes in a game simulation. Once you have built this engine, you may add deeper layers of complexity, characters, scenes, and game logic.

Resources Needed:

1. Eclipse IDE and Java installed on your system.
2. Android SDK installed within Eclipse with Emulator Software
3. Android Device (optional, but highly recommended)

you can learn how to install Eclipse IDE and Java , android SDK installed within Eclipse , AVD (android virtual device) setup Netbeans instalation, setup and use

Vocabulary:

1. Control-Model-View
2. XML Layout
3. Frame Based Animation
4. X and Y coordinate System (0,0 in upper left corner)
5. Emulator

Java:

1. Class
2. Constructor
3. Public
4. Private
5. Void
6. Data Types:
7. int
8. float
9. String
10. Function

Android SDK Terms:

1. Gesture Detector
2. Handler
3. Runnable
4. View
5. onDraw()
6. invalidate()
7. Canvas
8. Bitmap
9. BitmapDrawable
10. Resources
11. Activity

ok Friends this was the android game engine for android OS tutorial hope you people like it. stay with us for next tutorial.

Dear Readers if you have any query/question feel free to ask me via comment box given below. Also Follow us on social media site and share that post with your friends. - See more at: http://onlinecomputercafe.blogspot.com

MARK LINE ON A WEBPAGE, Html eightth tutorial, HTML tutorial,

Assalam o alaikum Friends how are you all?

how is going html. This is html eightth tutorial. hope you people like this tutorial. in prevoius tutorials we learn about text formatting now we are going to design our webpage.

MARK LINE ON A WEBPAGE:



   _______________________________________________________________________

Friends watch the line above. you can mark line like this every where on your webpage. it increases the beauty of your webpage. for Line you can use <hr> tag. this tag does not want closing tag. when you write this tag its draw a line on webpage. OK friends lets check the sub-codes of the <hr> tag.

Fixing the size of the line:

yes friends you can set manualy the size of the line. if you want to set the width of the line then you can use the below code.

<hr width="width size">

Example:

<hr width="15">

in the width field how much width you fix the line width will also the same. you can increase  or decrease the width size. remember that the size is count in pixels. friends you can also set the wisth in percent.

example:
<hr width="80%">

ok friends you can increase the height of the line or can make a box from a line.

For above example use below coding.

<hr size="100">
<hr size="Size">

OK Friends this was the html tutorial hope you people like it. stay with us for next tutorial. you can contact me through email: computercafe92@gmail.com

Dear Readers if you have any query/question feel free to ask me via comment box given below. Also Follow us on social media site and share that post with your friends. - See more at: http://onlinecomputercafe.blogspot.com

Beautiful Msoft Style SEO Friendly Premium Blogger Template Free

The most difficult part of creating a blog is to have beautiful, flexible and SEO Friendly template for your blog. Msoft comes with the solution of your problem and gonna serve you with the best Blogger template. Msoft is the most beautiful, user and seo friendly flexible templates which you can easily customize.for More Templates click here...

Msoft template has many useful features and potential. Following are some best features of this template:

1. User Friendly Interface 
2. SEO Friendly Design
3. Top Sticky Bar 
4. Easy Navigation Bar
5. Ad Space in Header 
6. Single Left Sidebar 
7. Social Widget
8. Threaded Comment Box
9. Related Post Widget etc

                                            
                                         DEMO                 DOWNLOAD

In order to install any template on blogger follow below steps:

1. First Download Template and Unzip it.
2. Login to Blogger >> Template >>
3. Click On Backup/Restore Button at Top Left
4. Select Template(.xml) From Your Computer
5. Hit Upload Button

That's all for Installing Blogger Templates.

This is the free of cost template for everyone but due to my hard efforts i had implemented  a footer credit link. Please Keep that link intact.

If you've knowledge about HTML, XML, CSS then you can customize this template and completely make this design of your blog. This template  needs some changes like re-placing social usernames, Feedburner username and little things. Simply follow the tutorials.

Editing Navigation Menu:

1. Go To Blogger >> Template >> Edit HTML 
2. Find For <ul id='nav'> 
3. You Will See The Following Code There.

<ul id='nav'> <li><a expr:href='data:blog.homepageUrl'>Home</a></li> <li>
<a class='hsubs' href='Place here your link'>Make Money</a>.... <div id='lavalamp'/> </ul>

place your link on place your link here
Repeat this for all <li> elements

Editing Socializer Widget:

1. Go To Blogger >> layout >> HTML/javascrip
2. place the following code

There You Will replace the following 

<style>
.subscribebtrix {
border: 2px solid #000000;
padding: 8px;
width: 310px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.subscribebtrix:hover {
-moz-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
-webkit-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
}
.tbimailbox {
border: 1px solid #D3D3D3;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset;
-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
color: #666;
font: 14px "trebuchet ms", sans-serif;
padding: 7px 15px;
width: 160px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.tbimailbox:hover {
-webkit-box-shadow: none;
box-shadow: none;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.btrixsubmit {
font: bold 12px Tahoma, Geneva, sans-serif;
font-style: normal;
color: #ffffff;
background: #ff5714;
border: 0px solid #ffffff;
text-shadow: 0px -1px 1px #222222;
box-shadow: 2px 2px 5px #000000;
-moz-box-shadow: 2px 2px 5px #000000;
-webkit-box-shadow: 2px 2px 5px #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
padding: 8px 15px;
cursor: pointer;
margin: 0 auto;
}
.btrixsubmit:active {
cursor: pointer;
position: relative;
top: 2px;
}
.btrixsubmit::-moz-focus-inner {
border: 0;
padding: 0;
margin: 0;
}
</style>

<br />
<div class="subscribebtrix">
<div style="color: #666666; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;">
Free Updates to your Inbox</div>
<div style="margin: 10px 0 0 6px;">
<form action="http://feedburner.google.com/fb/a/mailverify" class="emailform" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=OnlineComputerCafe', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="margin: 0pt;" target="popupwindow">
<input name="uri" type="hidden" value="OnlineComputerCafe" />
<input name="loc" type="hidden" value="en_US" />
<input class="tbimailbox" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" type="text" value="Enter your email..." />
<input alt="" class="btrixsubmit" title="" type="submit" value="Subscribe" />
</form>
</div>
<div style="border: none; color: #666666; font: 22px Oswald, cursive; margin: 25px 0 0 5px;">
Follow us:</div>
<div style="margin: -32px 0 0 120px;">
<a href="http://www.facebook.com/pages/Computer-Cafe/1672539536299066?fref=ts" target="_blank" title="Join us on Facebook"><img alt="facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhAl7fb8bQRalHjhSBIySN9y6oJqe3Yn2mKYxW6SdJLnR2uUGnYsKJfJBJHCsjvNZYiIGTFIFfnm7c6N-DmfG13FMziEM76uulX9Sm2uP-LuwnRi6KC276_AcVrYBp1qOgnIViu1rREeY/s1600/facebook_btrix.png" /></a>
<a href="https://plus.google.com/GOOGLE PLUS USER ID" rel="nofollow" target="_blank" title="Follow us on Google+"><img alt="gplus" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2bcEJvRBp7LzlAiXmeWo4rRU5Ie1pcsKs_54YgywF34tYCvcJs6vVE1Lyxgg4tS0r_8T8t55rh0y1guloeATf_usckfECnnoh0TieZm3BFxud_EIt7fhcmWPOfWSUY8awBKqk6sMw19s/s1600/googleplus_btrix.png" /></a>
<a href="http://feeds2.feedburner.com/OnlineComputerCafe" rel="nofollow" target="_blank" title="Subscribe to RSS"><img alt="rss" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXVLXU1BWUpq1rQLM3GeuMjV1u6aWrkR3ObP-MSg8VkWZ-Zn7Njf09B7RHFcLNSJkm1YQQpPVjiGSVq40xwuUy_HXp5YytaoPj1OPPkb9YUVAOlieMb9IWHtSR4UVjTp9yj2-ZxThBbbw/s1600/rss_btrix.png" /></a>
</div>
<div align="center">
<a href="http://feeds.feedburner.com/OnlineComputerCafe">
<img src="http://feeds.feedburner.com/~fc/OnlineComputerCafe?bg=99CCFF&amp;fg=444444&amp;anim=0" height="26" width="88" style="border:0" alt="" /></a>
</div>
</div>

Replace onlinecomputercafe With Your FB Page Username Also Replace The Twitter Link With Yours and RSS feed with yours.

Editing Footer Menu:

1. Go To Blogger >> Template >> Edit HTM
2. Find For <div id='footer-top-wrapper'>

There You Will See The Code Like Below
<div id='footer-top-wrapper'>
<div id='footer-top'>
<ul id='footer-navigation'>
<li><a href='Place your link here'>Home</a></li>
<li><a href='Place your link here'>About Us</a></li>
<li><a href='Place your link here'>Contact Us</a></li>
<li><a href='Place your link here'>Sitemap</a></li>
<li><a href='Place your link here'>FAQ</a></li>
<li><a href='Place your link here'>Privacy Policy</a></li>
</ul> <div id='backtotop'> <p id='back-top'> <a href='#'>Back to top</a> </p> </div> </div></div>

replace the place your link here text with your pages or label links.
Repeat this for all <li> elements

Congratulations! You've Successfully Customized The Template!

Note: Dear Readers if you have any query/question feel free to ask me via comment box given below.Also Follow us on social media site and share that post with your friends.

Html seventh tutorial, HTML tutorial,

Assalam o alaikum Friends. How are you all?
Friends our prevoius tutorial was about Formating. our this tutorial is about FONT Size and colors.

FONT SIZE:

Friends you can set any size of your Font. There are seven fix sizes of font in HTML. starts from one to seven. the smaller size is one and the bigger size is seven. For font size we can use FONT SIZE tag in the following format.

<font size="font size from 1 to 7">Text</font>
Example:
<font size="7">Onlinecomputercafe.blogspot.com</font>

Note: Friends you can change the font size this is the bigger size you can select smaller than seven.

FONT COLOR:

Font color means that you can set different colors of your text. in HTML there are uses color codes for font color. but you can change the font color by the name of that color. we use FONT COLOR tag in html.

Following is the format of font color.

<font color="color code or name">TEXT</font>
Example:
<font color="red">Onlinecomputercafe.blogspot.com</font>

Result:
Onlinecomputercafe.blogspot.com
Onlinecomputercafe.blogspot.com
Onlinecomputercafe.blogspot.com
Onlinecomputercafe.blogspot.com

ok Friends this was the html tutorial hope you people like it. stay with us for next tutorial.

Dear Readers if you have any query/question feel free to ask me via comment box given below. Also Follow us on social media site and share that post with your friends. - See more at: http://onlinecomputercafe.blogspot.com

Subscript and Superscript, Html sixth tutorial, HTML tutorial,

Assalam o alaikum Friends. How are you all?
our this tutorial is about Subscript and Superscript.

Subscript and Superscript:

Friends when you want to write 2 to power 3 or water formula then you have to use Subscript and Superscript.

Subscript:

Subscript are those values in which the power is below the text. below is HTML coding.

Text or value<SUB> Subtext or Value </SUB> Text or Value
H<SUB>2</SUB>O

Superscript:
Superscript are those values in which the power is up the text. below is HTML coding.

Text or value<SUP> Supertext or Value </SUP> Text or Value
H<SUP>2</SUP>O

Blockquote: 

If you want to show a quote on your webpage then use this blockquote tag is show clearly your quote.

Example:
<BLOCKQUOTE>This is Quote</BLOCKQUOTE>

DEL:

If you write some text wrong in your webpage and you want to correct that text and write again correct text. For this work use DEL tag.

Example:
<DEL>Wrong text</DEL>Correct text
<DEL>computercafe</DEL>onlinecomputercafe

When you write this code in your notepad and check the result you see the computercafe cutted with a line and then onlinecomputercafe so here computercafe is wrong text and onlinecomputercafe is correct text.

ADDRESS:

If we want to write address in our webpage. we can use ADDRESS TAG in HTML. it solve our problem to set the format of text.

Example:
<ADDRESS> YOUR ADDRESS</ADDRESS>
<ADDRESS> Lahore pakistan.</ADDRESS>

Ok friends this is tutorial about formating. i hope you people like it. our next tutorial is about FONT.

Dear Readers if you have any query/question feel free to ask me via comment box given below. Also Follow us on social media site and share that post with your friends. - See more at: http://onlinecomputercafe.blogspot.com

Tag attributes, Html Fifth tutorial, HTML tutorial,

Assalam o alaikum Friends How are you?

Friends our Fifth tutorial is about Tag Attributes. Tag Attributes is very important for webpage designing. To use tag attributes you can set your text in center, left or in right of your webpage. 

General code of tag attribute is below: 
<tag attribute="value">Affected Text</tag>

Friends this is the general code o tag attributes. this format will be used in every attribute.

Ok Friends lets study about types and use of attributes.

Text in center of webpage?
To write text in center of webpage use center tag. The formula for that tag is:
<p align="center">Centered text</p>
<p align="center">onlinecomputercafe.blogspot.com</p>

In this code p align define paragraph alignment and tells to the HTML Code that you want to align the text. In this code center tells to the HTML Code that you want to align the text in center. In this code center text tells to the HTML Code that you want this text to align in center.

Text in Right of webpage?
To write text in right of webpage use right tag. The formula for that tag is:
<p align="right">Rightsided text</p>
<p align="right">onlinecomputercafe.blogspot.com</p>

In this code p align define paragraph alignment and tells to the HTML Code that you want to align the text. In this code right tells to the HTML Code that you want to align the text in right side. In this code Rightsided text tells to the HTML Code that you want this text to align in right side.

Text in Left of webpage?
To write text in Left of webpage use Left tag. The formula for that tag is:
<p align="left">Leftsided text</p>
<p align="left">onlinecomputercafe.blogspot.com</p>

In this code p align define paragraph alignment and tells to the HTML Code that you want to align the text. In this code left tells to the HTML Code that you want to align the text in left side. In this code Leftsided text tells to the HTML Code that you want this text to align in left side.

Ok Friends its enough for Fourth Tutorial. in next tutorial we discuss Fonts. for more tutorials onlinecomputercafe.blogspot.com

Dear Readers if you have any query/question feel free to ask me via comment box given below. Also Follow us on social media site and share that post with your friends. - See more at: http://onlinecomputercafe.blogspot.com