# Make External?!?

**URL:** <https://ifnotnil.com/t/make-external/1762>\
**Category:** Other\
**Created:** [17 May 2021 01:26 UTC](https://ifnotnil.com/t/make-external/1762 "2021-05-17T01:26:48Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![npalardy](https://ifnotnil.com/user_avatar/ifnotnil.com/npalardy/32/10_2.png) [@npalardy](https://ifnotnil.com/u/npalardy)\
**Post date:** [17 May 2021 01:26 UTC](https://ifnotnil.com/t/make-external/1762/1 "2021-05-17T01:26:48Z")

</div>

fromTOF for @johnmcsoft

if you have images that are needed you do NOT need to drag them into your project to use them  
What this gets you a a nice _simple_ way to do that BUT it comes at cost (as youve noticed)  
You get a gigantic resources file

You can still use all the images without dragging them INTO the project

there are some things we can do to make this easier

---

<div class="post-metadata">

**Author:** ![johnmcsoft](https://ifnotnil.com/user_avatar/ifnotnil.com/johnmcsoft/32/1130_2.png) [@johnmcsoft](https://ifnotnil.com/u/johnmcsoft)\
**Post date:** [17 May 2021 01:44 UTC](https://ifnotnil.com/t/make-external/1762/2 "2021-05-17T01:44:50Z")

</div>

I’m open to suggestions. There are multiple resolutions for almost all of the images, of course…

---

<div class="post-metadata">

**Author:** ![npalardy](https://ifnotnil.com/user_avatar/ifnotnil.com/npalardy/32/10_2.png) [@npalardy](https://ifnotnil.com/u/npalardy)\
**Post date:** [17 May 2021 01:45 UTC](https://ifnotnil.com/t/make-external/1762/3 "2021-05-17T01:45:55Z")

</div>

First things first  
When you drag an image into you project what is happening ?  
Xojo does a bunch of work for you to make it so when you use that pictures NAME everything _just works_  
The actual details aren’t super important and they _could_ be done in any one of several ways  
What if when you run your project Xojo creates a “module” for you from all those pictures.  
And in there it has a method for each of your pictures that returns a “multi image” if there are 1 2 or 3 different resolutions.  
That would work but Xojo would probably need to make sure all the actually bitmaps etc for those images get copied to the runtime in a way that it can be sure they all exist  
So it does that.

And you have little , or not, control over this.  
Its why you will see many users recommending NOT doing this (it has other undesirable effects as well)  
As John found , it makes for a giant Resources File, that you cannot check into git.

So what if instead of relying on that bit of magic, and giant resources file, we did this for ourselves ?  
Its not hard - just takes al little code.  
And you can avoid the giant resources file  
But you WILL want to add a “copy files step” to make sure all your images get copied into the app bundle

---

<div class="post-metadata">

**Author:** ![npalardy](https://ifnotnil.com/user_avatar/ifnotnil.com/npalardy/32/10_2.png) [@npalardy](https://ifnotnil.com/u/npalardy)\
**Post date:** [17 May 2021 01:46 UTC](https://ifnotnil.com/t/make-external/1762/4 "2021-05-17T01:46:51Z")

</div>

give me a few minutes to stub out a way to AVOID the giant resources file

---

<div class="post-metadata">

**Author:** ![johnmcsoft](https://ifnotnil.com/user_avatar/ifnotnil.com/johnmcsoft/32/1130_2.png) [@johnmcsoft](https://ifnotnil.com/u/johnmcsoft)\
**Post date:** [17 May 2021 01:52 UTC](https://ifnotnil.com/t/make-external/1762/5 "2021-05-17T01:52:15Z")

</div>

copy files step is the easy part…

---

<div class="post-metadata">

**Author:** ![npalardy](https://ifnotnil.com/user_avatar/ifnotnil.com/npalardy/32/10_2.png) [@npalardy](https://ifnotnil.com/u/npalardy)\
**Post date:** [17 May 2021 01:56 UTC](https://ifnotnil.com/t/make-external/1762/6 "2021-05-17T01:56:23Z")

</div>

OK so here as REALLY simplified setup

 ![Screen Shot 1](https://ifnotnil.com/uploads/default/original/2X/e/e33967b0c5937a53322de8d055d511b240c1881d.jpeg)

a project with one image that is set to be the backdrop of a canvas  
there is no code

this is what we’ll work towards replacing in a way that makes sense  
there ARE some things we dont have a way to work around - its just the way the IDE works that makes this necessary

---

<div class="post-metadata">

**Author:** ![johnmcsoft](https://ifnotnil.com/user_avatar/ifnotnil.com/johnmcsoft/32/1130_2.png) [@johnmcsoft](https://ifnotnil.com/u/johnmcsoft)\
**Post date:** [17 May 2021 02:00 UTC](https://ifnotnil.com/t/make-external/1762/7 "2021-05-17T02:00:03Z")

</div>

Right…

---

<div class="post-metadata">

**Author:** ![npalardy](https://ifnotnil.com/user_avatar/ifnotnil.com/npalardy/32/10_2.png) [@npalardy](https://ifnotnil.com/u/npalardy)\
**Post date:** [17 May 2021 02:06 UTC](https://ifnotnil.com/t/make-external/1762/8 "2021-05-17T02:06:03Z")

</div>

First we’ll add a module to hold all our code  
I called mine _ResourceImageAccess_  
And, since I need to replace what Xojo does with my picture IO need a method named

```auto
Beeker_msn() as picture

```

so thats added as well

 ![Screen Shot 2021-05-16 at 8.00.04 PM](https://ifnotnil.com/uploads/default/original/2X/6/6d4f509849810968279fd245e2bf98b48d5a91d9.png)

and at this point if i run things still run - my method is NOT used yet

So I need to

1. add a copy files step to copy my image into the resources dir (maybe a sub dir)
2. write code that will find the resources folder in the app
3. and load an image into a multi image by name

---

<div class="post-metadata">

**Author:** ![johnmcsoft](https://ifnotnil.com/user_avatar/ifnotnil.com/johnmcsoft/32/1130_2.png) [@johnmcsoft](https://ifnotnil.com/u/johnmcsoft)\
**Post date:** [17 May 2021 02:10 UTC](https://ifnotnil.com/t/make-external/1762/9 "2021-05-17T02:10:09Z")

</div>

Ah! That’s actually pretty straightforward, it just requires some advance planning. I’m packing for a trip tonight, will give this a go in the morning. THANK YOU!

---

<div class="post-metadata">

**Author:** ![npalardy](https://ifnotnil.com/user_avatar/ifnotnil.com/npalardy/32/10_2.png) [@npalardy](https://ifnotnil.com/u/npalardy)\
**Post date:** [17 May 2021 03:49 UTC](https://ifnotnil.com/t/make-external/1762/10 "2021-05-17T03:49:08Z")

</div>

the copy files step is pretty easy

create one and make sure the destination is set to resources (and maybe a subdir as well which I will use for this example)

 ![Screen Shot 2021-05-16 at 9.08.04 PM](https://ifnotnil.com/uploads/default/original/2X/3/3705762f49cd5a1c56218da9eb4e0adae0869d8e.jpeg)

so now when we run of build the images will be in Resources \> images

on to the code  
Add a method to the ResourceImageAccess module

```auto
Private Function findImagesDir() As folderitem
  
  Dim f As folderitem = SpecialFolder.Resources
  
  If f Is Nil Or f.exists = False Then
    Return Nil
  End If
  
  // note this should match the SUBDIR name from the copy file step !!!!!!
  If f.Child("Images") Is Nil Or f.Child("Images").Exists = False Then
    Return Nil
  End If
  
  Return f.Child("Images")
End Function

```

This will locate the dir where the copy file step put all the images

Now we need to create a “multiimage”  
Add the following method to the module  
This method will look for png & jpg images  
It also defaults to looking for the 1x WITHOUT any @1x , and the 2x and 3x with @2x and @3x suffixes to the base name( normal macOS naming for image sets)

```auto
Private Function multiimage(baseName as string) As picture
  Dim imageRoot As folderitem = findImagesDir
  
  If imageRoot Is Nil Then
    Return Nil
  End If
  
  Dim imageFolderitem As folderitem
  
  Dim images() As picture
  
  // lets see what we can find - we can / could use png, jpg - we'll prefer pngs
  
  // 1x image
  imageFolderitem = imageRoot.Child(basename+".png")
  If imageFolderitem Is Nil Or imageFolderitem.exists = False Then
    imageFolderitem = imageRoot.Child(basename+".jpg")
  End If
  If ((imageFolderitem Is Nil) = False) And (imageFolderitem.exists = True) Then
    images.append Picture.Open(imageFolderitem)
  End If
  
  // 2x image
  imageFolderitem = imageRoot.Child(basename+"@2x.png")
  If imageFolderitem Is Nil Or imageFolderitem.exists = False Then
    imageFolderitem = imageRoot.Child(basename+"@2x.jpg")
  End If
  If ((imageFolderitem Is Nil) = False) And (imageFolderitem.exists = True) Then
    images.append Picture.Open(imageFolderitem)
  End If
  
  
  // 3x image
  imageFolderitem = imageRoot.Child(basename+"@3x.png")
  If imageFolderitem Is Nil Or imageFolderitem.exists = False Then
    imageFolderitem = imageRoot.Child(basename+"@3x.jpg")
  End If
  If ((imageFolderitem Is Nil) = False) And (imageFolderitem.exists = True) Then
    images.append Picture.Open(imageFolderitem)
  End If
  
  
  Try
    Dim multiPicture As New Picture(images(0).width,images(0).height, images )
    
    Return multiPicture
  Catch iax As InvalidArgumentException
  Catch noe As NilObjectException
  Catch oom As OutOfMemoryException 
  End Try
  
  Return Nil
  
End Function
```

And now Beeker\_msn, in my case, is

```auto
Public Function Beeker_msn() As picture
  
  Return multiImage( "Beeker_msn" ) 
  
End Function
```

Now for the glitches  
With images dragged into the IDE you can set backdrops etc in the IDE by selecting an image  
That will not work with this mechanism. It cant. The IDE has no idea about our custom mechanism

So anywhere we had set a property we will need a couple lines of code to set the property

In this screen shot I’ve cloned the canvas so the one on the left uses an image dragged into the project and the one on the right will set the backdrop property

 ![Screen Shot 2021-05-16 at 9.43.35 PM](https://ifnotnil.com/uploads/default/original/2X/e/eff67126c3c60e921469fd5221d772e9a30c0176.jpeg)

And so the open event of the right hand canvas reads

```auto
Me.Backdrop = Beeker_msn
me.invalidate
```

- now you may notice that the image I have is named Beeker\_msn1 and my method Beeker\_msn.  
In order to do this demo I cant name them EXACTLY the same as things wont work

And now I cant simply add whatever methods I need to the module and remove the images dropped into my project and get rid of the giant resources file.

---

<div class="post-metadata">

**Author:** ![johnmcsoft](https://ifnotnil.com/user_avatar/ifnotnil.com/johnmcsoft/32/1130_2.png) [@johnmcsoft](https://ifnotnil.com/u/johnmcsoft)\
**Post date:** [17 May 2021 04:41 UTC](https://ifnotnil.com/t/make-external/1762/11 "2021-05-17T04:41:45Z")

</div>

That’s pretty slick! I hope you’re well and have work, thanks again 👍

---

<div class="post-metadata">

**Author:** ![MonkeybreadSoftware](https://ifnotnil.com/user_avatar/ifnotnil.com/monkeybreadsoftware/32/451_2.png) [@MonkeybreadSoftware](https://ifnotnil.com/u/MonkeybreadSoftware)\
**Post date:** [17 May 2021 10:35 UTC](https://ifnotnil.com/t/make-external/1762/12 "2021-05-17T10:35:25Z")

</div>

You may want to use a static variable in the Beeker\_msn method to cache the picture.  
Or a dictionary in multiimage() to cache them all.

---

<div class="post-metadata">

**Author:** ![npalardy](https://ifnotnil.com/user_avatar/ifnotnil.com/npalardy/32/10_2.png) [@npalardy](https://ifnotnil.com/u/npalardy)\
**Post date:** [17 May 2021 13:56 UTC](https://ifnotnil.com/t/make-external/1762/13 "2021-05-17T13:56:58Z")

</div>

Oh sure  
This was just “the basics”  
After you get this down you can do al kinds of things

---

<div class="post-metadata">

**Author:** ![languer](https://ifnotnil.com/letter_avatar_proxy/v4/letter/l/9d8465/32.png) [@languer](https://ifnotnil.com/u/languer)\
**Post date:** [17 May 2021 15:38 UTC](https://ifnotnil.com/t/make-external/1762/14 "2021-05-17T15:38:24Z")

</div>

@johnmcsoft  
You may want to mention on TOF that you got your issue addressed outside the forum (since you can’t mention this place over there), but it was solved nonetheless. Cause the responses you got there pale in comparison to what you got here - I mean is not even close

---

<div class="post-metadata">

**Author:** ![npalardy](https://ifnotnil.com/user_avatar/ifnotnil.com/npalardy/32/10_2.png) [@npalardy](https://ifnotnil.com/u/npalardy)\
**Post date:** [17 May 2021 16:19 UTC](https://ifnotnil.com/t/make-external/1762/15 "2021-05-17T16:19:01Z")

</div>

he didnt even get a reply there until this morning

now the resource file being HUGE is screwy unless you have numerous icons, cursors etc

I suppose you could delete it then reset the app icon

---

<div class="post-metadata">

**Author:** ![johnmcsoft](https://ifnotnil.com/user_avatar/ifnotnil.com/johnmcsoft/32/1130_2.png) [@johnmcsoft](https://ifnotnil.com/u/johnmcsoft)\
**Post date:** [23 May 2021 14:39 UTC](https://ifnotnil.com/t/make-external/1762/16 "2021-05-23T14:39:06Z")

</div>

FWIW, I’m recovering from retina surgery, will be looking at all of this in a few weeks. Thank you!

---

<div class="post-metadata">

**Author:** ![Emile](https://ifnotnil.com/letter_avatar_proxy/v4/letter/e/58956e/32.png) [@Emile](https://ifnotnil.com/u/Emile)\
**Post date:** [23 May 2021 16:36 UTC](https://ifnotnil.com/t/make-external/1762/17 "2021-05-23T16:36:48Z")

</div>

I hope you are not alone as this is a difficult time if the other eye is not \> 5/10°…

I wish you a good recovery.

---

<div class="post-metadata">

**Author:** ![johnmcsoft](https://ifnotnil.com/user_avatar/ifnotnil.com/johnmcsoft/32/1130_2.png) [@johnmcsoft](https://ifnotnil.com/u/johnmcsoft)\
**Post date:** [23 May 2021 17:49 UTC](https://ifnotnil.com/t/make-external/1762/18 "2021-05-23T17:49:26Z")

</div>

Fortunately, my husband and our dog are here, it’s going well and the doctor sounds very pleased so far. Thank you!

---

<div class="post-metadata">

**Author:** ![johnmcsoft](https://ifnotnil.com/user_avatar/ifnotnil.com/johnmcsoft/32/1130_2.png) [@johnmcsoft](https://ifnotnil.com/u/johnmcsoft)\
**Post date:** [24 May 2021 20:58 UTC](https://ifnotnil.com/t/make-external/1762/19 "2021-05-24T20:58:44Z")

</div>

Got surgery good news today, complete and better than expected results, I may have full vision within the week!

---

<div class="post-metadata">

**Author:** ![Emile](https://ifnotnil.com/letter_avatar_proxy/v4/letter/e/58956e/32.png) [@Emile](https://ifnotnil.com/u/Emile)\
**Post date:** [26 May 2021 15:42 UTC](https://ifnotnil.com/t/make-external/1762/20 "2021-05-26T15:42:43Z")

</div>

Glad to read that.

I am waiting for new glasses.

[Next page](https://ifnotnil.com/t/make-external/1762.md?page=2)