Grimmy's Forum Posts

  • I have a HTMLElement with lots of things going on inside it. One of those things is a range slider with an id of 'slider-1'.

    I want to change a value (some variable) in the event sheet when this slider has been changed. I can see there is a htmlElement onClicked event for buttons which works great, but I can't find anything for a slider.

    How would I do this?

    I tried the following javascript snippet. It does nothing but I have a feeling I might be on the right track ...

    var slider = document.getElementById("slider-1");
    var textElement = document.getElementById("val-1");//a text element to display the current value
    
    slider.addEventListener("input", function() {
     
    	var sliderValue = this.value;
     textElement.textContent = sliderValue;
     
    });
    

    Thanks

    Tagged:

  • Im trying some advanced html tricks but Im getting this error when I run my game due to one of my html elements has the following section of script was part of its html body:

    <script src="jquery-3.7.1.min.js"></script> <script src="jquery-ui.min.js"></script> <script> $(document).ready(function() { $("#Tabs1").tabs( { show: false, hide: false, event: 'click', collapsible: false }); });

    The jquery source files are in the Files directory but I also tried them in scripts but I still get the same error in the console.

    Any ideas? Maybe Jquery isn't supported?

    Im actually trying to create a tabbed interface but when I bring it across all the styling is lost.

    Thanks

  • Thanks, but really none of that makes any sense.

    -Choosing HTML would NOT make an interface look like a website.(unless you wanted it too)

    -If I choose html over traditional C3 objects then yes, programming approach is completely different. One uses html, css and javascript and the other other uses uses traditional C3 coding and the layout view visual setup (Scene graph hierarchies etc).

    There are various advantages and disadvantages for each but I'm starting to think that html is now the better option.

    As of the update yesterday(r369), the html object got a significant update allowing us to us html layers 'under or over' traditional c3 art layers. This makes the html approach even more appealing.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Can I bump this one? I d like to get some feedback on any experiences people may have had. HTML or C3 hand rolled?

    Cheers

  • Thanks so much for this. Very useful! I tested it and ran into a slight issue. The code you sent doesn't account for the # character so if your hex has a # character the resulting colours will be very green.

    If your hex numbers contain # symbols you might want also to add the following line to trim it from the string first:

    set hex to replace(hex, "#", "")

    This way both formats will work. eg 0000ff and #0000ff

    I have attached screenshot..

  • My Javascript function changes hex values to rgb like so:

    localVars.gotColour = hexToRgb("#bceadf");
    

    The function is returning an object which contains rgb values like so.

    return {r, g, b};
    

    But how do I get theses into the event sheet as something useable? The gotColour variable is an object with the 3 variables inside, but I cant seem to use it for anything useful. (apart from printing object r:12, g:34 b:34 to the console)

    I would have expected I could do something like the following in the event sheet after the function had been run:

    Set Colour to gotColour //does nothing

    .or this..

    Set Colour to rgbEx255(gotColour[0],gotColour[1],gotColour[2]) //bad syntax

    ..but those do nothing....

    I guess I could write 3 different functions to each get the r,g,b values individually but that seems very messy.

    Any tips?

  • I want to import colour palettes from a JSON file and I find it much tidier to have a single hex value to represent each colour rather than an array of 3 different values (rgb).However, I can seem to find any way in C3 to set colour using Hex values(in code)). (only RGB)

    I figured the best way would be to write a little converter in Javascript, but even though I have the new converted values as an array (eg rgb_array = [r,g,b];) I dont know how to get this back from my Javscript into construct. I can only set values of variables in Construct that are strings, numbers or booleans.

    Cheers

    p.S I tried the plugin called 'CONVERTERCOLORJS (AIOUTE GAO)' but using the following:

    Set Color Colour_Converter.toRGB("#e4646e")

    Didnt do anything to the colour.

    Tagged:

  • The answer is:

    anglelerp(Self.Orbit.Rotation,new_angle,lerp_speed)

    Although it would be nice to know how to do it with a tween so I can get more control over the easing.

  • I want a sprite to orbit another sprite by setting the orbit rotation (in orbit behaviour) every frame, but I want the orbiting sprite to smoothly ease to its new position. How do I do this?

    I have tried create a value tween in the update loop and then assigning that value every frame to the Orbit.Rotation value but that seems to make a bit of a mess.

  • The answer is to Tween the property Angle. (Add a tween behaviour) and use...

    angle(Self.X,Self.Y,Mouse.X,Mouse.Y)

    ..as the tween end value

  • I can use rotateToward to rotate the sprite to the position but I want it to ease in and ease out as I move the mouse. What's the recommended way?

    Cheers

  • Hi, I used the ProUI plugin on a previous game project. A great plugin but which sadly is now seemingly a dead plugin. However, with the rise of the C3 html element plugin and the scene graph, things have become slightly easier than before to create a UI . But for me I am still confused about best practices for UI.

    I have made games/apps with both pure html (for a yellow pages type app) and with the ProUI library in construct 3 (for a game), so I have experience in both, but I'm still not sure if the recommended approach for complex game UI would be raw C3 sprites or pure html...or a mix of the two? When I mean complex UI I mean something like an RPG with crafting/inventory screens etc.

    Personally I love the rigidity and organization of html but I find it difficult to be visual and creative when developing for it. Maybe there are some recommended tools that could help with this?

    I presume html would be the best approach, but if that is the case; are there any recommended workflows? Perhaps people use webflow and bring the code across or maybe there are other faster ways? Webflow looks good, but its pricey.

    Chat GPT does a fairly good job in getting you started, but in cant do any of the texturing/icons artwork. Its only really good for the raw layout and even then you also have a lot of customization work to do afterwards.

    I know that a lot of C3 devs just tend to make casual games that only require a super simple UI, but are there users with any tips or best practices in order to create larger scale UIs?

    Thanks

    Tagged:

  • Apologies for not responding.

    In the end I just had my html slide on from the right to save time but I never resolved this. I have had to temporarily move to another project (non construct 3) so I cant address this at the moment, but in the future I hope to come back to investigate more on this. Principally using C3 commands to animate html elements.

  • I have a html window (element) that I can position off the right side of my screen fine, but when I try to position less than x =0 (off to the left of the screen) the html window wont move below 0 (eg x=-50). Why could this be?

    I'm am doing all the positioning using the c3 event sheet.

    Cheers

    Tagged:

  • Ha ha. Like my brain. Okay cheers.