• Hey Guest! Ever feel like entering a Game Jam, but the time limit is always too much pressure? We get it... You lead a hectic life and dedicating 3 whole days to make a game just doesn't work for you! So, why not enter the GMC SLOW JAM? Take your time! Kick back and make your game over 4 months! Interested? Then just click here!

GML [SOLVED] Draw line alpha

Morkinas

Morkinas

Member
Hello, so i need to draw line with 0.5 alpha, but I guess I can only add the fade point
so it starts with alpha=1 and fades to my set value 0.01 in this case. I need to set start and end alpha to 0.5

Draw Event
Code: 
var dir = point_direction(x, y, mouse_x, mouse_y);
var d = 1800;

//Hitscan
for(var i = 0; i < d; i++) 
{
    var lx = x + lengthdir_x(i, dir); 
    var ly = y + lengthdir_y(i, dir);
    var hit = (collision_line(x, y, lx, ly, wall, false, true));
    if hit != noone
        {
        break; //stops drawing line after a collision
        }
    else
    {
        //Draw Laser
  draw_set_alpha(0.01);
  draw_line_width_color(x, y, lx, ly, 1, c_yellow, c_yellow) 
    }
}
draw_set_alpha(1);
What would be best way to fix this? Thanks

topelement.jpg
 
Binsk

Binsk

Member
That is odd behavior. Honestly seems like a bug to me to be honest.

I whipped up a quick script for you that should give you all the flexibility you need. What it does is build a line out of two triangles and draws that instead:
Code: 
///    @func    draw_line_ext(x1, y1, x2, y2, color1, alpha1, width1, color2, alpha2, width2)
///    @desc    Draws a line with custom widths, colors, and alphas.
///    @param    {real}    x1    starting x-pos
///    @param    {real}    y1    starting y-pos
///    @param    {real}    x2    ending x-pos
///    @param    {real}    y2    ending y-pos
///    @param    {real}    color1    starting color
///    @param    {real}    alpha1    starting alpha
///    @param    {real}    width1    starting width
///    @param    {real}    color2    ending color
///    @param    {real}    alpha2    ending alpha
///    @param    {real}    width2    ending width
///    @returns    {undefined}


var x1 = argument0,
    x2 = argument2,
    y1 = argument1,
    y2 = argument3,
    c1 = argument4,
    c2 = argument7,
    a1 = argument5,
    a2 = argument8,
    w1 = argument6,
    w2 = argument9;
  
  
    // Save the old world matrix:
var _mat_world = matrix_get(matrix_world);

    // Build a matrix to rotate our line to point in the correct direction:
matrix_set(matrix_world, matrix_build(x1, y1, 0, 0, 0, point_direction(x1, y1, x2, y2), 1, 1, 1));

    // Build our line out of triangles and draw:
draw_primitive_begin(pr_trianglestrip);
draw_vertex_color(0, -w1 / 2, c1, a1);
draw_vertex_color(x2 - x1, -w2 / 2, c2, a2);
draw_vertex_color(0, w1 / 2, c1, a1);
draw_vertex_color(x2 - x1, w2 / 2, c2, a2);
draw_primitive_end();

    // Reset the old matrix:
matrix_set(matrix_world, _mat_world);

return undefined;
In your case you would use it as such:
Code: 
draw_line_ext(x, y, lx, ly, c_yellow, 0.5, 1, c_yellow, 0.5, 1);
Hope that helps you out.
 
CloseRange

CloseRange

Member
Binsk said:
What it does is build a line out of two triangles and draws that instead
Click to expand...
that's what I like to call, a rectangle :D
in the case of the OPs problem it's not a bug it's the fact that you keep drawing the line over itself.
Drawing a line at opacity .1 then drawing another line right over it that's also .1 causes a line that's the same as alpha .2
In your case every time the line moves a little ways out you are redrawing that .1 opacity line from start to the new point, causing a gradient effect.
Blinsk's solution should work (i didn't try it so who knows) but just for learning I'll provide you a fix to your problem.
Code: 
var dir = point_direction(x, y, mouse_x, mouse_y);
var d = 1800;

//Hitscan
for(var i = 0; i < d; i++)
{
    var lx = x + lengthdir_x(i, dir);
    var ly = y + lengthdir_y(i, dir);
    var hit = (collision_line(x, y, lx, ly, wall, false, true));
    if hit != noone
        {
        break; //stops drawing line after a collision
        }
    else
    {
        //Draw Laser
  draw_set_alpha(0.01);
  draw_line_width_color(x, y, lx, ly, 1, c_yellow, c_yellow)
    }
}
draw_set_alpha(1);


Code: 
var dir = point_direction(x, y, mouse_x, mouse_y);
var d = 1800;

var lx = x;
var ly = y;
//Hitscan
for(var i = 0; i < d; i++)
{
    lx = x + lengthdir_x(i, dir);
    ly = y + lengthdir_y(i, dir);
    var hit = (collision_line(x, y, lx, ly, wall, false, true));
    if hit != noone
        {
        break; //stops drawing line after a collision
        }
    else
    {
    }
}
//Draw Laser
draw_set_alpha(0.01);
draw_line_width_color(x, y, lx, ly, 1, c_yellow, c_yellow)
draw_set_alpha(1);
see what I did? just moved where you drew the line out of the for loop and initalized the lx and ly variables also outside of it (just in case distance is 0)
now instead of drawing the opaque lines every check it just draws it one time when you know the final positions
 
Morkinas

Morkinas

Member
CloseRange said:
that's what I like to call, a rectangle :D
in the case of the OPs problem it's not a bug it's the fact that you keep drawing the line over itself.
Drawing a line at opacity .1 then drawing another line right over it that's also .1 causes a line that's the same as alpha .2
In your case every time the line moves a little ways out you are redrawing that .1 opacity line from start to the new point, causing a gradient effect.
Blinsk's solution should work (i didn't try it so who knows) but just for learning I'll provide you a fix to your problem.
Code: 
var dir = point_direction(x, y, mouse_x, mouse_y);
var d = 1800;

//Hitscan
for(var i = 0; i < d; i++)
{
    var lx = x + lengthdir_x(i, dir);
    var ly = y + lengthdir_y(i, dir);
    var hit = (collision_line(x, y, lx, ly, wall, false, true));
    if hit != noone
        {
        break; //stops drawing line after a collision
        }
    else
    {
        //Draw Laser
  draw_set_alpha(0.01);
  draw_line_width_color(x, y, lx, ly, 1, c_yellow, c_yellow)
    }
}
draw_set_alpha(1);


Code: 
var dir = point_direction(x, y, mouse_x, mouse_y);
var d = 1800;

var lx = x;
var ly = y;
//Hitscan
for(var i = 0; i < d; i++)
{
    lx = x + lengthdir_x(i, dir);
    ly = y + lengthdir_y(i, dir);
    var hit = (collision_line(x, y, lx, ly, wall, false, true));
    if hit != noone
        {
        break; //stops drawing line after a collision
        }
    else
    {
    }
}
//Draw Laser
draw_set_alpha(0.01);
draw_line_width_color(x, y, lx, ly, 1, c_yellow, c_yellow)
draw_set_alpha(1);
see what I did? just moved where you drew the line out of the for loop and initalized the lx and ly variables also outside of it (just in case distance is 0)
now instead of drawing the opaque lines every check it just draws it one time when you know the final positions
Click to expand...
Thank you it worked
 
You must log in or register to reply here.
Top