IMAGE BROWSING WITH NAME BELOW,

Ok I have been visiting this tutorials and havent seen much about this

Page 1 of 1

9 Replies - 1245 Views - Last Post: 22 September 2009 - 08:18 AM Rate Topic: -----

#1 vishner   User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 14
  • Joined: 19-September 09

IMAGE BROWSING WITH NAME BELOW,

Posted 19 September 2009 - 02:32 PM

Hello I was wondering?
If i am to write an image browser program?
just like this one Attached Image ,

How should i start with the coding. I cant seem to make it through some collision detection routine or something. I am thinking of writting this kind of program or game in a manner where where i can move the image (a file stored in the project) in a manner that if its in the center will look like the one in the picture above and then is I click A or a keyboard button the image will go in fullscreen? and also how will i have a file name below each im
age?

This post has been edited by vishner: 19 September 2009 - 02:35 PM


Is This A Good Question/Topic? 0
  • +

Replies To: IMAGE BROWSING WITH NAME BELOW,

#2 SixOfEleven   User is offline

  • Planeswalker
  • member icon

Reputation: 1055
  • View blog
  • Posts: 6,643
  • Joined: 18-October 08

Re: IMAGE BROWSING WITH NAME BELOW,

Posted 19 September 2009 - 03:19 PM

What language? What graphics library/sdk? You will have to give us a little more details.
Was This Post Helpful? 0
  • +
  • -

#3 vishner   User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 14
  • Joined: 19-September 09

Re: IMAGE BROWSING WITH NAME BELOW,

Posted 19 September 2009 - 03:24 PM

View PostSixOfEleven, on 19 Sep, 2009 - 02:19 PM, said:

What language? What graphics library/sdk? You will have to give us a little more details.

This will be For microsoft visual C# implemented in XNA 3.1 for windows platform but i also need to port it to XBOX

Microsoft VISUAL C# express 2008 and XNA 3.1 ... Windows and XBOX platform. I am really new to XNA thats why i cant work with this well
Was This Post Helpful? 0
  • +
  • -

#4 SixOfEleven   User is offline

  • Planeswalker
  • member icon

Reputation: 1055
  • View blog
  • Posts: 6,643
  • Joined: 18-October 08

Re: IMAGE BROWSING WITH NAME BELOW,

Posted 19 September 2009 - 03:44 PM

Everything on that would be Texture2Ds so you would have to use a SpriteBatch object to do the rendering between calls to Begin and End. I would load the images into a List<Texture2D> because you may want the list to grow easily.

Could you please post what you have tried so far as at Dream.In.Code we require a good faith effort on your part. We will not do your homework for you. Please post your code in tags.

:code:
Was This Post Helpful? 0
  • +
  • -

#5 vishner   User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 14
  • Joined: 19-September 09

Re: IMAGE BROWSING WITH NAME BELOW,

Posted 19 September 2009 - 03:52 PM

I only started with raw codes , just getting codes from websites and trying them out, I'm here to learn different implementations. But for what i tried. I'll see to post it around this time of the day, If you could point me to some tutorials that will regard to this kind of topic. It would be nice...
Was This Post Helpful? 0
  • +
  • -

#6 vishner   User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 14
  • Joined: 19-September 09

Re: IMAGE BROWSING WITH NAME BELOW,

Posted 19 September 2009 - 04:04 PM

And also I have the Idea on how I could Implement this but just cant get to work it through my codes.

My theories would include :

1: create a rectangular border which will trace the image when positioned exactly at the center of the border.

2. then once the trace is completed the image should zoom a little as seen in the picture.

I'll just work on my codes a little bit and post some of the results. I hope you'll keep in visiting this post for those who are interested in helping
Was This Post Helpful? 0
  • +
  • -

#7 SixOfEleven   User is offline

  • Planeswalker
  • member icon

Reputation: 1055
  • View blog
  • Posts: 6,643
  • Joined: 18-October 08

Re: IMAGE BROWSING WITH NAME BELOW,

Posted 19 September 2009 - 07:53 PM

You are on the right track with your idea about having a rectangle that frames the image and drawing the image inside of it. If you have the frame rectangle it is fairly easy to center it and draw it on the screen. You will know what the height and width of the image will be as the Texture2D objects have Height and Width properties. To center it on the screen you would use the following. borderImage is your frame image.

Rectangle centerScreenRectangle = new Rectangle(
            (screenWidth - borderImage.Width) / 2,
            (screenHeight - borderImage.Height) / 2,
            borderImage.Width,
            borderImage.Height);



There is an overload of the Draw method that takes a Texture2D as the first argument, a destination rectangle as the second, which you just calculated and the tint color as the third. You probably don't want to tint it so you would use Color.White for the tint color which means there will be no tinting.

spriteBatch.Draw(borderImage, centerScreenRectangle, Color.White);



Centering an image inside of this is a little trickier but still quite manageable. You would need to create a second rectangle and draw it using the above overload. borderWidth and borderHeight below would be the width and height of your border image.

Rectangle innerRectanle = new Rectangle(
            centerScreenRectangle.X + borderWidth,
            centerScreenRectangle.Y + borderHeight,
            borderImage.Width - (2 * borderWidth),
            borderImage.Height - (2 * borderHeight));

spriteBatch.Draw(yourImage, innerRectangle, Color.White);



Just a note though. You HAVE to draw the image AFTER you draw the border image. The order in which you render in 2D is IMPORTANT.

That should at least get you started. Good luck with your programming adventures.
Was This Post Helpful? 1
  • +
  • -

#8 vishner   User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 14
  • Joined: 19-September 09

Re: IMAGE BROWSING WITH NAME BELOW,

Posted 20 September 2009 - 01:24 AM

Thanks This is really helpful? Also? How about the game loop? I am really confused with game loops

{
			// TODO: Add your initialization logic here
			this.TargetElapsedTime = TimeSpan.FromSeconds(1);
			this.IsFixedTimeStep = true;
			base.Initialize();
		}


I am using this kind of code for initiation because i want to make a splash screen before directly going to the main menu



 protected override void Update(GameTime gameTime)
		int a = 0
		  {
			KeyboardState KEYSTATE = Keyboard.GetState();
			a = a + 1
	
			base.Update(gameTime);
		}



as you can see in my code I use an int value for a to be use in an IF statement

		{
			if (a == 10)
			{
				GraphicsDevice.Clear(Color.Black);
				spriteBatch.Begin();
				spriteBatch.Draw(mainmenu, bgholder, Color.White);
				spriteBatch.End();
			}


				base.Draw(gameTime);


		}


In here I used The if conditional to confirm the value of a since it will be incremented in every UPDATE??

Is there an easier way to this? and could you point me into some more basic Game Loop Tutorials that deals more with timespan?
Was This Post Helpful? 0
  • +
  • -

#9 SixOfEleven   User is offline

  • Planeswalker
  • member icon

Reputation: 1055
  • View blog
  • Posts: 6,643
  • Joined: 18-October 08

Re: IMAGE BROWSING WITH NAME BELOW,

Posted 20 September 2009 - 11:03 AM

There is another method you could consider, using TimeSpan. Don't bother with this code:

}
    // TODO: Add your initialization logic here
    this.TargetElapsedTime = TimeSpan.FromSeconds(1);
    this.IsFixedTimeStep = true;
    base.Initialize();
}



Instead declare two class level variables. A TimeSpan object and a bool variable.

TimeSpan splashScreenTimeSpan = TimeSpan.Zero;
bool splashScreenVisible = true;



Now, in the Update method, you would have something like this:

splashScreenTimeSpan += gameTime.ElapsedGameTime;

if (splashScreenTimeSpan > TimeSpan.FromSeconds(2) && splashScreenVisible == true)
{
    splashScreenVisible = false;
}



What the above code will do is each time Update is called it will add the elapsed game time since the last call to Update the splashScreenTimeSpan variable. The if statement checks to see if the variable is greater than 2 seconds and the splashScreenVisible variable is true. If both conditions are met splashScreenVisible is set to false.

Now, in the Draw method you would do this between your calls to Begin and End

spriteBatch.Begin();
if (splashScreenVisible == true)
{
    // Draw your splash screen here
}
else
{
    // Draw your game here
}
spriteBatch.End();



Eventually you might want to look into use Game Components as an option.

Good luck with your game programming adventures.
Was This Post Helpful? 1
  • +
  • -

#10 vishner   User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 14
  • Joined: 19-September 09

Re: IMAGE BROWSING WITH NAME BELOW,

Posted 22 September 2009 - 08:18 AM

hello, Thanks , you got my point and I think using offset will make my work easier. Thanks for all your help. I will finish this work and post the whole code for a contribution....
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1