12 Replies - 1932 Views - Last Post: 17 May 2016 - 02:09 AM

#1 hannibal smith  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 05-May 16

SemiTrasparent Rectangle with XNA

Posted 05 May 2016 - 10:25 AM

Hi, i've build a chart application with XNA and VB.NET, basically using LineList,I recently add a selection feature so user can select a few of data from the chart; I'd like make this selection graphically like windows selection, with a semitrasparent rectangle(now i use a line under the chart to indicate which data are selected); I tryed to do a rectangle with 2 triangle using TriangleList but this rect hide my chart and app freeze. Anyone can give some advice to implement this feature?

Is This A Good Question/Topic? 0
  • +

Replies To: SemiTrasparent Rectangle with XNA

#2 SixOfEleven  Icon User is offline

  • Planeswalker
  • member icon

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

Re: SemiTrasparent Rectangle with XNA

Posted 05 May 2016 - 02:02 PM

I'd suggest taking a look at the tutorial in the link below. It will show you how to draw shapes in XNA. Instead of using a solid colour you can create a colour where the alpha is say 25% instead of 100%. It should be relatively easy to convert the C# into VB.NET.

http://www.dreaminco...1&#entry1353774
Was This Post Helpful? 0
  • +
  • -

#3 hannibal smith  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 05-May 16

Re: SemiTrasparent Rectangle with XNA

Posted 05 May 2016 - 09:53 PM

View PostSixOfEleven, on 05 May 2016 - 02:02 PM, said:

I'd suggest taking a look at the tutorial in the link below. It will show you how to draw shapes in XNA. Instead of using a solid colour you can create a colour where the alpha is say 25% instead of 100%. It should be relatively easy to convert the C# into VB.NET.

http://www.dreaminco...1&#entry1353774

ThankYou!!! I will try soon.
Was This Post Helpful? 0
  • +
  • -

#4 hannibal smith  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 05-May 16

Re: SemiTrasparent Rectangle with XNA

Posted 11 May 2016 - 03:58 AM

It work! Thanks!
Was This Post Helpful? 0
  • +
  • -

#5 basteagui  Icon User is offline

  • D.I.C Head

Reputation: 14
  • View blog
  • Posts: 60
  • Joined: 08-September 13

Re: SemiTrasparent Rectangle with XNA

Posted 13 May 2016 - 02:48 AM

i should point out the method for set data is horrible and very slow and you shouldn't be doing this.

        private void DrawRectangle(Rectangle coords, Color color)
        {
            var rect = new Texture2D(GraphicsDevice, 1, 1);
            rect.SetData(new[] { color });
            spriteBatch.Draw(rect, coords, color);
        }



this is the code i used on the early versions of my game and it is horrible. it destroyed my FPS.

what you should do is load up a texture that is only 1 pixel big with the color you want and then draw a rectangle with that texture in it.

don't use setdata cause it will kill your program

here's the code you want to use instead:


//load a bmp file 1 pixel tall/wide colored black.

Texture2D menu = Content.Load<Texture2D>("1blackpixel"); //1 black pixel . bmp

//define middle of screen

Vector2 screenmid = new Vector2(graphics.PreferredBackBufferHeight / 2, graphics.PreferredBackBufferWidth / 2);

//define a rectangle
          Rectangle  menuRectangle = new Rectangle(0, 0, (PreferredBackBufferWidth / 3) * 2, (PreferredBackBufferHeight / 3) * 2); //make the rectangle two thirds as big as the screen.

spriteBatch.Draw(menu, screenmid  , menuRectangle, Color.White * 0.5f, 0.0f, screenmid , 1f, SpriteEffects.None, 0f);




OK, you see the part where i write spritebatch.draw? inside it i write Color.White * 0.5f.
that's the transparency, 0.5
if you multiply that color times a float it will give you the transparency you want. Color.White * 0.25f would be 25% visible.
it will still draw black because the texture is black, don't get fooled by the Color.White value, that just means "don't tint this texture or stain it with a color"
Was This Post Helpful? 0
  • +
  • -

#6 SixOfEleven  Icon User is offline

  • Planeswalker
  • member icon

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

Re: SemiTrasparent Rectangle with XNA

Posted 13 May 2016 - 09:55 AM

In this case then I'd use a white pixel rather than a black one because white tints where as black does not. You can tint white to blue using Color.Blue *0.5f instead of Color.White * 0.5f. If you do that with black it stays black. It allows you to reuse the asset rather than needing multiples. I used this approach in a brick breaking game. I created 1 texture in shades of grey and then tinted them to make them appear in different colors.
Was This Post Helpful? 1
  • +
  • -

#7 hannibal smith  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 05-May 16

Re: SemiTrasparent Rectangle with XNA

Posted 14 May 2016 - 03:51 AM

Hi, when I use only texture and sprites it work fine, but when i try to use alse primitivetypes I get errore. here my code:
Option Strict On
Option Explicit On

Imports System.IO
Imports Microsoft.Xna.Framework
Imports Microsoft.Xna.Framework.Graphics
Public Class Form1
    Public Shared test As Integer
    Private grafix As Graphics.GraphicsDevice = Nothing
    Private s_Batch As SpriteBatch
    Private sprite As Texture2D
    Private sprite2 As Texture2D

    Private Function initialize(ByRef surface As PictureBox) As Boolean
        Try
            Dim pparam As New PresentationParameters
            pparam.DeviceWindowHandle = surface.Handle
            pparam.IsFullScreen = False

            Dim grafixAdapt As GraphicsAdapter = GraphicsAdapter.DefaultAdapter

            grafix = New GraphicsDevice(grafixAdapt, GraphicsProfile.HiDef, pparam)


            initialize = True
        Catch ex As Exception
            initialize = False
        End Try
    End Function

    Public Shared Function BitmapToTexture2D(ByVal GraphicsDevice As GraphicsDevice, ByVal image As System.Drawing.Bitmap) As Texture2D
        Dim bufferSize As Integer = image.Height * image.Width * 4

        ' Create new memory stream and save image to stream so    
        ' we don't have to save and read file   
        Dim memoryStream As New System.IO.MemoryStream(bufferSize)
        image.Save(memoryStream, System.Drawing.Imaging.ImageFormat.Png)

        ' Creates a texture from IO.Stream - our memory stream
        memoryStream.Seek(0, SeekOrigin.Begin)
        Dim texture As Texture2D = Texture2D.FromStream(GraphicsDevice, memoryStream, image.Width, image.Height, False)

        memoryStream.Close()
        Return texture
    End Function


    Private Sub Load_Content()
        If IsNothing(grafix) = False Then
            s_Batch = New SpriteBatch(grafix)

            sprite = BitmapToTexture2D(grafix, My.Resources.my_image)
            sprite2 = BitmapToTexture2D(grafix, My.Resources.my_image2)
        Else
            Throw New ArgumentNullException("Grafix")
            Exit Sub
        End If

    End Sub

    Private Sub BackgroundWorker1_DoWork(ByVal sender As System.Object, ByVal e As System.ComponentModel.DoWorkEventArgs) Handles BackgroundWorker1.DoWork
        Do Until True = False
            grafix.Clear(Color.Black)
            ' Dim newlineORI() As VertexPositionColor = Graphic2D.Set2dLine(x1ori, y1ori, z1, x2ori, y2ori, z2, colorOri) ' 
            Dim newlineORI() As VertexPositionColor = Set2dLine(10, 20, 0, 200, 250, 0, Color.Azure)

            [color="#FF0000"]grafix.DrawUserPrimitives(PrimitiveType.LineList, newlineORI, 0, 1) [/color]
               With s_Batch
                .Begin(SpriteSortMode.Deferred, BlendState.AlphaBlend)
                .Draw(sprite, New Rectangle(0, 0, test, 200), Color.White * 0.3F)
                .End()
            End With
            grafix.Present()
        Loop

    End Sub
    Public Shared Function Set2dLine(ByVal x1 As Integer, ByVal y1 As Integer, ByVal z1 As Integer, _
                           ByVal x2 As Integer, ByVal y2 As Integer, ByVal z2 As Integer, _
                           ByVal color As Color) As VertexPositionColor()
        Dim vertices1, vertices2 As New VertexPositionColor

        vertices1.Position = New Vector3(x1, y1, z1)
        vertices1.Color = color
        vertices2.Position = New Vector3(x2, y2, z2)
        vertices2.Color = color

        Return {vertices1, vertices2}
    End Function
    Private Sub SetUpCamera()
        Dim cameraPos = New Vector3(-25, 13, 18)
        Dim viewMatrix = Matrix.CreateLookAt(cameraPos, New Vector3(0, 2, -12), New Vector3(0, 1, 0))
        Dim projectionMatrix = Matrix.CreatePerspectiveFieldOfView(MathHelper.PiOver4, grafix.Viewport.AspectRatio, 1.0F, 200.0F)
    End Sub

    Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Dim bool As Boolean = initialize(PictureBox1)

        If bool = True Then
            Call Load_Content()
            ' SetUpCamera()
            BackgroundWorker1.RunWorkerAsync()
        Else
            MessageBox.Show("There was a problem initializing XNA.")
            Me.Close()
        End If
    End Sub

    Private Sub PictureBox1_MouseMove(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox1.MouseMove
        test = e.Location.X
    End Sub

    Private Sub PictureBox1_Click(sender As System.Object, e As System.EventArgs) Handles PictureBox1.Click

    End Sub
End Class


I get this exception: In order to perform design operations , setting both a vertex shader that a pixel shader on the device.
and stop debug on the red line.
how ca i solve?
Was This Post Helpful? 0
  • +
  • -

#8 hannibal smith  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 05-May 16

Re: SemiTrasparent Rectangle with XNA

Posted 16 May 2016 - 02:09 AM

any advice?
Was This Post Helpful? 0
  • +
  • -

#9 basteagui  Icon User is offline

  • D.I.C Head

Reputation: 14
  • View blog
  • Posts: 60
  • Joined: 08-September 13

Re: SemiTrasparent Rectangle with XNA

Posted 16 May 2016 - 02:22 AM

ok i didn't know you wanted to make more complex shapes than just a rectangle.

i think you shouldn't be setting spritebatch to draw your linelist at all. maybe this is causing you trouble.

rather, set transparency up as your blendstate in your graphic device like this

GraphicsDevice.BlendState = BlendState.AlphaBlend;

like this

and then just make the instruction to draw your primitive, linelist, trianglelist or whatever.

if you want to set the color of these vertices to have transparency make the color value of the vertexpositioncolor format into 0,0,0,0.5f
the values to input are red, green, blue and then alpha at the end.
if you use Color.Black in XNA it will give you 0,0,0,1.

so what i usually do is give the vertices a new Color(0,0,0,0.5f);

again, i am not entirely sure this is giving you trouble, but that's how i do it.
Was This Post Helpful? 0
  • +
  • -

#10 hannibal smith  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 05-May 16

Re: SemiTrasparent Rectangle with XNA

Posted 16 May 2016 - 02:28 AM

I want draw line chart(that work alone with primitive) and then draw a trasparent rectangle on it that work). but when i mix them as showed code i get exception.
Was This Post Helpful? 0
  • +
  • -

#11 basteagui  Icon User is offline

  • D.I.C Head

Reputation: 14
  • View blog
  • Posts: 60
  • Joined: 08-September 13

Re: SemiTrasparent Rectangle with XNA

Posted 16 May 2016 - 11:53 PM

ok i think i know what's wrong.

where your code throws exception you are drawing something yes???

just before you draw it do this:

basicEffect.CurrentTechnique.Passes[0].Apply();

then draw

or apply the passes to your technique in the effect/basiceffect you defined
Was This Post Helpful? 0
  • +
  • -

#12 hannibal smith  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 05-May 16

Re: SemiTrasparent Rectangle with XNA

Posted 17 May 2016 - 02:00 AM

thanks, I change this line:
 Private Sub BackgroundWorker1_DoWork(ByVal sender As System.Object, ByVal e As System.ComponentModel.DoWorkEventArgs) Handles BackgroundWorker1.DoWork

        Do Until True = False
            Dim basicEffect = New BasicEffect(grafix)
            basicEffect.CurrentTechnique.Passes(0).Apply()
            grafix.Clear(Color.Black)
            ' Dim newlineORI() As VertexPositionColor = Graphic2D.Set2dLine(x1ori, y1ori, z1, x2ori, y2ori, z2, colorOri) ' Disegna ORI
            Dim newlineORI() As VertexPositionColor = Set2dLine(10, 20, 0, 200, 250, 0, Color.Azure)
            grafix.BlendState = BlendState.AlphaBlend
            grafix.DrawUserPrimitives(PrimitiveType.LineList, newlineORI, 0, 1)
            With s_Batch
                .Begin(SpriteSortMode.Deferred, BlendState.AlphaBlend)
                .Draw(sprite, New Rectangle(0, 0, test, 200), Color.White * 0.3F)
                .End()
            End With
            grafix.Present()
        Loop

    End Sub

now exception disapear, but when i run the app i can see only the rectangle and not the azure line. Can you help me?
Was This Post Helpful? 0
  • +
  • -

#13 hannibal smith  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 05-May 16

Re: SemiTrasparent Rectangle with XNA

Posted 17 May 2016 - 02:09 AM

I solve myself, i forget to declare the effect.. Thanks again at All!!!!
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1