I have a sprite widget in NGUI, and It can't be brought to front what ever the depth I change in the editor:
Note that the orange panel is a scroll view of NGUI.
Here is the inspector setting of the sprite that I want to set to the very front:
And here is the inspector setting that has overlapped the above sprite that I want to make front of it.
And here is the BottomPanel setting
I finally solve this problem by
Add another panel
Setting the added panel in front the origin one
Make the sprite child of the newly added panel
And the final hierarchy is like this:
And this link of NGUI forum helps
quoted here:
"Depth" property is used to determine the drawing order of the widgets within the same panel that use the same atlas. If you are using different atlases or labels using a dynamic font, bring the widgets forward on the transform's Z, moving them closer to the camera (-Z). If you are using different panels, adjust the transform of the panel you want to bring in front to a lower negative Z value (-Z). I highly recommend sticking to one atlas if you can manage it, it will make your life significantly easier.
And I make a youtube video to explain what I have achieved so far.
Everything looks fine to me but it doesn't seem to work for you. There is another workaround.
On the UIPanel, change the Render Q to Explicit then use z-axis to sort your UISprite. I mean the z position (P) not (R) or (S)
For example, change the z-axis of the "Sprite (1)" object to be 2 then change the z-axis of the "background" object to 1. If this does not work, change the values around.
Please make sure that the Sprite is under the panel.
Related
I'm quite new to Unity, so I'm sorry if this is a basic question. I've been trying to set up the UI for a mobile game, but I'm not quite sure how to make the UI lock it's position, no matter the screen size. I've tried using anchors (though I don't fully understand how to use them properly), I've tried using a canvas scaler, I've looked at the Unity document and I just can't seem to find an answer. The buttons are off screen/half off the screen when I build the game to my device/switch screen sizes in the game view. Does anyone know how to fix this?
You can set your anchor point by selecting the UI object (such as a button) and then clicking here and selecting the right anchor point. You can also press down shift to set the pivot and/or alt to move the object to that point at the same time. The object should now be anchored to that point and keep its position even if the resolution is changed. You can set a precise position from the inspector, too. Simply adjust the Pos X and Pos Y variables. It will still adhere to the anchor point.
Note that you might have to play around with the Canvas object's UI Scale mode and its settings to get the right setup.
These are my current settings and let me know if you all need more information to help me solve this issue.
Camera : Perspective
Canvas Render Mode : World Space
In the picture below the focus here is when the user wants to select a ship of their choice they click where "Select V" is and you see "Fighter ship image, but the problem here is that not only is the "Green Circle" in the way but the dropdown itself it just not big enough.
In this second picture below you can see the scaling has been done to make the dropdown more visable but as you can see in this picture below that it is hidden behind another ship select box (ship2 in the Hierarchy).
I have tried making the Z coordinate larger/small and even if I have it come closer to the camera it still is represented behind the ship2 gameobject. I am at a total loss for ideas on how to approach this and if anyone could shed some light on this that would be awesome!
Here are 2 more screen shots just in-case the first 2 images were not enough information to go on.
If I understood your question correctly, your UI is behind the ship but you want it to be above the ship. If that's the case read below, else leave a comment.
objects in the hierarchy is rendered based on the order of your objects in the hierarchy, not the depth. The Unity UI is rendered from top to button in the hierarchy. Don**'t go changing the z-axis if you want to change the display order. It doesn't work like **NGUI.
If you want any object to be displayed on top, it has to be put bellow the object in the hierarchy NOT on top.
If object A is on top of object B in the scene, the problem is from the hierarchy. Go to the hierarchy and put object B below object A if you want object B to be on top of object A.
Also, don't scale the UI the way you did in picture #2. Change the scale of shipRow1 back to 1,1,1 then use the Width and the Height properties to change its size.
I have created a level editor using new UI system in Unity3D.
Using Level Editor:
I can drag the ui elements,
I am able to save them in scriptable objects
But how could i save and load them at runtime?
I mean, if i create a level with some {width x hight} resolution and if i load it on different resolution, then the whole UI positioning get distorted.
How could i anchor them correctly programmatically?
Any help would be appreciated.
There are good video tutorials about the 4.6.x UI here:
http://unity3d.com/learn/tutorials/modules/beginner/ui.
Especially for positioning the elements I recommend watching: http://unity3d.com/learn/tutorials/modules/beginner/ui/rect-transform.
I suggest you learn how to use the anchor correctly first. If you want to change the position and size of UI element in a script you can do that through the RectTransform component. It offers functions like offsetMax,offsetMin and sizeDelta for position your UI element. The functions you need to use depend on your anchor setting.
as LokiSinclair said. You just need to Adjust the Scale that the new UI provided. It is the four Arrow on the Canvas of each Object and every UI object is inheriting their scale behavior from their Parent.
I want to show a transparent building in our project. I did that by setting the material of the mesh to be "transparent/diffuse". However, there exists some visibility problem of the mesh of the building. At some position, I can only see two or three sides of the cuboid(the transparent block, i.e the building). If I adjust my character position, I can see the whole cuboid. I googled the similar question online, someone mentioned about the frustum view of the camera. It seems like character has to be inside the frustum view of the camera, then user can see the whole mesh of the cuboid.
Can anyone give me some suggestions? I feel like it might be something about the way of how I build my mesh for the building, but at some position, I can see the whole cuboid.
I've solved this problem. It is just about the way how you construct the mesh.Basically, for the cuboid, I reconstructed the mesh in this way:
triangles[0]=topleft;
triangles[1]=topright;
triangles[2]=bottomright;
triangles[3]=bottomright;
triangles[4]=bottomleft;
triangles[5]=topleft;
Note: This is just front side, the other sides should be constructed in a same way.
Besides, in order to show the mesh when user enters the block, you have to construct the inside area of the block in previous way.
I'm investigating the feasibility of using Raphael for a user-research project. One of the features allows for users to drag images onto a canvas and we record where they placed it. The pool of images is potentially quite large and we'll have them in a scrollable box in the tool.
I put together a quick wireframe of the issue I'm looking into since it'll probably be clearer than my explanation.
Please see the wireframe:
I'd stick with straight HTML/CSS and use jQueryUI draggables, as you mention in your comment.
You don't appear to need any of the drawing/display features SVG offers, yet if you went that route, you'd have to build your own custom scrolling behavior (instead of setting a CSS overflow-y rule) and picture layout algorithms (again instead of using CSS floats or something).
You can create a scrollable region using Raphael.
Create the viewport with fixed
dimensions (say 800x600)
Draw the images with increasing y value. After few images, the y value will go beyond 600. It will be drawn but will not be visible in the viewport.
Create a scrollbar using raphael rects. Attach drag events to the scrollbar handle rect.
When the handle is moved, translate all the images accordingly.
For e.g. lets assume in step 2, you had drawn all the images and the bottom most point of the end image is having y value 2000. Assuming the scrollbar has length 500, each dx movement of the handle will have to translate 2000/500 = 4dx. You can calculate the handle length similarly using ratios.
Since everything inside a single Raphael paper the dragging of images will work seamlessly. You will have to maintain the positions of each images.
You might find this demo similar
Remember you can always use getBBox when you drop. In this case it's rects but images would be the same..
http://irunmywebsite.com/raphael/additionalhelp.php?q=bearbones