C# Xna Made Easy Tutorial 30 - Split Screen[Camera Effects] Video Lecture | C# Game Development: Game Making made Easy (English)

hello everybody and welcome to your next
see sharp axe in a tutorial so last
tutorial was it should have been pretty
fun for those of you who didn't order
handle screen scrolling already and this
tutorial is going to be a bit more fun
in my opinion than the last tutorial and
what we're going to be doing this
building upon the last tutorial so what
you're going to want to do is get your
coat from last tutorial oh yeah so let
us get started so what are we going to
be doing this tutorial this tutorial
we're going to be using viewports in
order to actually make a split screen
game so split screen games are
everywhere they're really cool it's
really cool to play a game with a friend
playing single games by itself was
always fun but playing a game with a
with a friend or something can give you
a whole other experience that a single
player games but can't give you right so
sometimes you might want to incorporate
two players or whatever like maybe if
you're making a platformer game and you
want to have two players or you want to
see or you're doing like a tag game or
something you want to have a split
screen or or you want to have a race to
see who gets where 10 first whatever
then you can do so with split screens
well so you can handle this like four
languages like I like grown stuff they
don't have built-in viewports and stuff
or actually language i meant api's but
there is ways to handle it without using
and viewports but viewports and C sharp
and XNA incorporates them then might as
well use them because they make your
life so much easier okay so let us get
into the code so leave your purse are
going to work that what the player the
first player is going to take off one
take the left half of the screen and the
second player is going to control the
right half of the screen and what we're
going to essentially do it each of you
is that the first view is going to draw
the first player and the second view is
going to draw the second player okay not
only the second view no both of the
views are going to draw both players are
but the first we is going to follow the
first player in the second me is going
to follow the second player so therefore
just like both of you guys are on the
same map but you guys are viewing
different portions depending on where
you are etc etc and if you want it so
that like player one is on a different
level or or player two's on different
level depending on whether they're
playing the game or you want them to be
you don't want to be in the same map etc
etc then you don't have to draw this the
player on on you don't have to draw the
both players on each pupil you could
draw one player and one view porn in the
next plane the other viewport it's up to
you how you want to handle it but this
is the way I'm doing in this tutorial so
first of all what you should notice that
in the player class I created two keys I
mean for keys are you up down left and
right and indie I made a constructor I'm
gonna play a class that takes four up
four parameters one up down left and
right and I just set the values up down
left and white right my my variables and
then in the update method I say that
they press the down key and this would
happen if they press the up key right
and left okay and we do this because we
want to specify different directional
button to the left of the first player
in the second player so if you go to
game one CS I we're going to need two
players classes into camera classes
right one one camera to follow one
player another camera to follow the next
player so we can easily just make a two
players you can say player um player one
and then we can make a player 2 etc etc
but might as well make an array of it so
I met an array I took the array 22 I
have two elements and I'm putting a new
player i specify the directional buttons
for the first player and i put a comma
and special specify the directional
buttons for the second player upon
initialization and for the camera I just
said it to to Cameron the cameras and I
created to camera instances right there
so in initialize i use for each loop too
psycho to each one of the players and i
initialize each other players now we're
going to go back up to the top of the
code again and a week rate we have a
viewport now the default view is going
to be the whole window like we're going
to see in the whole window the player
one viewport is going to be what we see
on the player ones window and the player
to view port is going to want to see
what we see on the the second players
view okay and I have a texture 2d the
divider which is going to be aligned
that would divide our to screen so we
can clearly see whose player want what
player one can see you on players you
can see so right now we to set the views
all the views are going to be equal to
the default view so we do this default
view is equal to player 1 view is equal
to player to view is equal to graphics
device out viewport so all of them
acquire the viewport so our player ones
are the the first the player one's view
and the players 2 v's with is going to
be equal to the now it doesn't matter
which one you can do you could do player
2 views with or anything not since
they're all the same but just so you
don't get confused so it's going to be
equal to the default views with / to
since I it both took up half of the
screen so it's basically saying the
width of each of these is equal to the
screen with / to that's what this is
saying and then since both since the
player to 32 on the right hand side of
the screen then we have to set the x
coordinate equal to the for the full
screen / 2 so we'll start off from the
center of the screen and draw it towards
the end of the screen okay and the
player 1 we will start from coordinate 0
and draw to the halfway point of the
screen so for a load content we have
another for each and we load the content
from each player for the divider we load
our divider image and everything remains
the same so for update method with this
is how we're going to do it so we have
we're gonna have a for loop dowell is a
length the player and since a player in
camera how the same on the alum
just increment by 1 and we do player
either update we update the game and
then we do camera I update and we update
the current players position simple
enough so once you go to the draw all
this stuff seems a bit different but
first of all we want to go down to the
bottom and create a method called draw
scene so we're gonna take three things
in the parameters it's going to take the
both of the players the current camera
that we're going to be using for that
play that we're controlling and the game
time which is needed by four player draw
for the players movements ok so we do
this by Bosch begin and you can cop you
can cut this or cut this in places right
here from the last tutorial it was up
here but you can place in here and it's
the same as last tutorial so we do the
spritebatch we can we ever spray back
end within it we have our background
that we had a last tutorial and what we
want to do is we're going to do our for
each and cycle through each of the
players and draw each player
individually ok so why this is why this
is needed because first camera our first
camera is going to follow the first
player and when we call it draw seen
again we're going to put in our second
camera which is going to follow the
second player so we're drawing both
players to the screen in each viewport
but one is Center eyes on one player so
if we go to our draw method what we do
is we set our graphics device tab you
poured into our player one view so now
we're focus on the the first viewport so
we do draw scene ok and we're drawing
the scene to this view port right here
ok so the to the first viewport and then
we put in our players both of our
players the camera 0 which is
representing the first player and game
time in there then we reset then the
viewport equal to player view number two
so we're focusing on a second player ok
and now so it's like focusing on the
second viewport we do draw scene we're
drawing both players but we set camera
to one this time so we're following the
second player ok and then we set that to
game time
and then last but not least we do graphs
our viewport a default view and then we
just do spray batch begin and spread
back and then we draw a divider equal to
the screen will divide by two and then
we do color white the reason why I have
subtracted one is that the width of my
dividers equal to three pixels so for
the actual center the divider to be in
the center of the screen then we do this
scheme with / to subtract one and then
we end it the reason why we draw the
divider here is that we don't want to
divide to scroll that's what we have in
a different spritebatch stop begin so
it's not affected relative to our
cameras position so if I was to run this
program everything should run
efficiently so if I drive this interview
this is going to be our this is our
first player on the left and our second
player on the right so as you can see we
have both players and if you look at
both views everything remains the same
but if you notice ah the first view is
following the player but in the second
view with its locating on the the second
player so looks as though the players
off the screen based on the player two's
view so if I go up right here on the
players to view the player is gone
because according to the player to view
we can play a tues view we can't see the
player anymore but in the player one's
view with center eyes on the player
right so everything moves accordingly
then you see the player again as for the
second players viewport if we look at it
right here if we move the player down
then we can which centers on the player
and when we move it everything moves
accordingly so the second viewport
follows the second player the first
viewport follows the first player and
therefore yeah you like two different
viewports so that is it for this
tutorial I hope you enjoyed it then to
watching and bye