Wayback Machinekoobas.hobune.stream
May JUN Jul
Previous capture 12 Next capture
2021 2022 2023
1 capture
12 Jun 22 - 12 Jun 22
sparklines
Close Help
  • Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
  • Asset Store
  • Get Unity

UNITY ACCOUNT

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account
  • Blog
  • Forums
  • Answers
  • Evangelists
  • User Groups
  • Beta Program
  • Advisory Panel

Navigation

  • Home
  • Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
    • Blog
    • Forums
    • Answers
    • Evangelists
    • User Groups
    • Beta Program
    • Advisory Panel

Unity account

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account

Language

  • Chinese
  • Spanish
  • Japanese
  • Korean
  • Portuguese
  • Ask a question
  • Spaces
    • Default
    • Help Room
    • META
    • Moderators
    • Topics
    • Questions
    • Users
    • Badges
  • Home /
avatar image
0
Question by SovietSpartan · Oct 12, 2016 at 03:24 AM · uiui imagemaskpixeloverlapping

Getting the overlapping pixels between a UI mask and a UI image

Hello! I'm making a system where the user imports an image from their hard drive and then masks it with a white circle image (completly transparent on the outer sections of the circle) and then saves the resulting masked image.

However, the only problem i have right now is that i can't find a way to get the overlapping pixels between a UI mask and a UI image. What i need is to get the pixels from the UI image that overlap only the white circle portion of the UI Mask image, and with that, create a new texture.

This is how my UI setup looks like.

"Mask", well, is the mask image, and "TargetImage" is the image that's being masked and you can see inside the circle fully opaque. I need to get the pixels from "TargetImage" that are overlapping the mask image's circle and then create a new texture the same resolution as the mask's texture of the masked "TargetImage".

Any help on this is certainly appreciated!

Comment
Add comment · Show 4
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users
avatar image Twin-Stick · Oct 12, 2016 at 01:57 PM 0
Share

Hey there, I'm not sure if I fully understand what you're wanting - but to me it sounds like you have a mask image which you want to use and cut out only what is relevant from the user image?

Here is some code that may help - you would need to correctly set up your mask image prior with alpha however this should do the job... Let me know how you go!

 Texture2D userImage;
 Texture2D mask;
         
 // check image size, resize if required
 if (userImage.width != mask.width || userImage.height != mask.height)
 {
     userImage.Resize(mask.width, mask.height);
 }
 
 // Set alpha from mask into userImage        
 for(int i = 0; i < userImage.width * userImage.height; i++)
 {            
     int y = i / mask.width;
     int x = i - (y*mask.width);
     Color col = userImage.GetPixel(x, y);
     col.a = (mask.GetPixel(x, y)).a;
     userImage.SetPixel(x, y, col);
 }
avatar image SovietSpartan Twin-Stick · Oct 12, 2016 at 08:46 PM 0
Share

Thanks for replying! I'm sorry if i didn't explain myself well enough. What i want is to get the masked portion of "TargetImage". Right now i'm using Texture2D.ReadPixels() to take a screenshot of the "TargetImage"'s portion i want and then i apply the alpha from the $$anonymous$$ask's texture. This works nicely with fully opaque target images, but i also want to be able to get the masked portion of images with transparency, and save them as .png files.

For this, i found out that if i could get which pixels of "TargetImage" are overlapping "$$anonymous$$ask" 's texture then i could apply them into a new Texture2D and save it.

Your script would grab the target texture and resize to the $$anonymous$$ask's texture size. What i need is to get the masked portion of the target texture, since the users will be able to move and resize the "TargetImage" to mask any portion of their image that they want.

Thanks for the help! Any more help is also appreciated!

avatar image SunnyChow · Oct 13, 2016 at 05:21 AM 0
Share

Have you try using a camera with transparent color as clear flag, and render it to a render texture? i guess it should keep the transparency of the ui elements.

 RenderTexture.active = renderTexture;
 texture2D.ReadPixels (new Rect(0,0, renderTexture.width, renderTexture.height),0,0);
 texture2D.Apply ();
 RenderTexture.active = null;

avatar image SovietSpartan SunnyChow · Oct 13, 2016 at 09:57 PM 0
Share

Ohh i didn't know you could use ReadPixels() with a Render texture to get a transparent image!! Thanks!! I ended up creating a second Camera to mask out only the UI and then make a function to disable any other unnecessary UI behind the image i want and then take the screenshot.

Thanks for the help! It would be nice if Unity included a way to get overlapping pixels between UI elements or atleast a way to get the position on Screen coordinates of a Texture's pixel using GetPixel(), though.

0 Replies

· Add your reply
  • Sort: 

Your answer

Hint: You can notify a user about this post by typing @username

Up to 2 attachments (including images) can be used with a maximum of 524.3 kB each and 1.0 MB total.

Follow this Question

Answers Answers and Comments

4 People are following this question.

avatar image avatar image avatar image avatar image

Related Questions

Create UI Mask from Childrens images 2 Answers

Poke hole in UI Image? 1 Answer

UI Masking (Type visiblity of the content outside and inside of mask ) 0 Answers

Get size of UI Image at runtime 3 Answers

Unity UI not showing some Images 0 Answers


Enterprise
Social Q&A

Social
Subscribe on YouTube social-youtube Follow on LinkedIn social-linkedin Follow on Twitter social-twitter Follow on Facebook social-facebook Follow on Instagram social-instagram

Footer

  • Purchase
    • Products
    • Subscription
    • Asset Store
    • Unity Gear
    • Resellers
  • Education
    • Students
    • Educators
    • Certification
    • Learn
    • Center of Excellence
  • Download
    • Unity
    • Beta Program
  • Unity Labs
    • Labs
    • Publications
  • Resources
    • Learn platform
    • Community
    • Documentation
    • Unity QA
    • FAQ
    • Services Status
    • Connect
  • About Unity
    • About Us
    • Blog
    • Events
    • Careers
    • Contact
    • Press
    • Partners
    • Affiliates
    • Security
Copyright © 2020 Unity Technologies
  • Legal
  • Privacy Policy
  • Cookies
  • Do Not Sell My Personal Information
  • Cookies Settings
"Unity", Unity logos, and other Unity trademarks are trademarks or registered trademarks of Unity Technologies or its affiliates in the U.S. and elsewhere (more info here). Other names or brands are trademarks of their respective owners.
  • Anonymous
  • Sign in
  • Create
  • Ask a question
  • Spaces
  • Default
  • Help Room
  • META
  • Moderators
  • Explore
  • Topics
  • Questions
  • Users
  • Badges