HISE Logo Forum
    • Categories
    • Register
    • Login

    Very newb question: how do I load an image file?

    Scheduled Pinned Locked Moved General Questions
    7 Posts 5 Posters 254 Views
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • VirtualVirginV
      VirtualVirgin
      last edited by VirtualVirgin

      I created a new image UI component and then put this in the onInit:

      Screenshot 2024-11-01 at 11.16.27 PM.png

      This complies ok but the image does not appear in the UI; I get "Missing" in a grey box.

      The file in question is placed in the "Images" folder in the project folder of this project.
      The Docs say this is the default folder?

      What would I need to do to get the image to appear?

      You can listen to my orchestral mockups here:
      https://www.virtualvirgin.net/

      dannytaurusD orangeO 2 Replies Last reply Reply Quote 0
      • dannytaurusD
        dannytaurus @VirtualVirgin
        last edited by

        @VirtualVirgin I think you need to load the image(s) into the pool first.

        Link Preview Image
        HISE | Scripting | Engine

        An API class for accessing global properties.

        favicon

        (docs.hise.dev)

        Engine.loadImageIntoPool( String id)
        

        Meat Beats: https://meatbeats.com
        Klippr Video: https://klippr.video

        1 Reply Last reply Reply Quote 0
        • DWD
          DW
          last edited by

          I think you need to use a panel, something like this.

          // loads the image from the project's Image folder
          Panel.loadImage("{PROJECT_FOLDER}sunset.png", "sunset");
          
          Panel.setPaintRoutine(function(g)
          {   
             g.fillAll(Colours.white);
             g.drawImage("sunset", [0, 0, 200, 200], 0, 0);
             g.drawImage("sunset", [200, 0, 300, 200], 0, 0);
          });
          

          Link Preview Image
          HISE | Scripting | Script Panel

          The reference guide for the ScriptPanel

          favicon

          (docs.hise.dev)

          d.healeyD 1 Reply Last reply Reply Quote 0
          • d.healeyD
            d.healey @DW
            last edited by

            @DW He's using an image control so a panel isn't necessary

            Libre Wave - Freedom respecting instruments and effects
            My Patreon - HISE tutorials
            YouTube Channel - Public HISE tutorials

            DWD 1 Reply Last reply Reply Quote 1
            • DWD
              DW @d.healey
              last edited by

              @d-healey thank you for clarifying!

              1 Reply Last reply Reply Quote 0
              • orangeO
                orange @VirtualVirgin
                last edited by

                @VirtualVirgin Copy the image file to the project's Images folder. After that, you can change all of the properties with setPropertiesFromJSON easily. I also added Width and Height for example.

                const var VVLogo = Content.getComponent("VVLogo");
                
                Content.setPropertiesFromJSON("VVLogo", {    
                    "width": 150,
                    "height": 150,
                    "fileName": "{PROJECT_FOLDER}VV_logo.jpg"
                  });
                
                
                

                develop Branch / XCode 13.1
                macOS Monterey / M1 Max

                VirtualVirginV 1 Reply Last reply Reply Quote 0
                • VirtualVirginV
                  VirtualVirgin @orange
                  last edited by

                  @orange said in Very newb question: how do I load an image file?:

                  @VirtualVirgin Copy the image file to the project's Images folder. After that, you can change all of the properties with setPropertiesFromJSON easily. I also added Width and Height for example.

                  const var VVLogo = Content.getComponent("VVLogo");
                  
                  Content.setPropertiesFromJSON("VVLogo", {    
                      "width": 150,
                      "height": 150,
                      "fileName": "{PROJECT_FOLDER}VV_logo.jpg"
                    });
                  
                  
                  

                  Thank you :)
                  Yes, this solved it!

                  You can listen to my orchestral mockups here:
                  https://www.virtualvirgin.net/

                  1 Reply Last reply Reply Quote 0
                  • First post
                    Last post

                  25

                  Online

                  1.8k

                  Users

                  12.0k

                  Topics

                  104.0k

                  Posts