Search Unity

  1. Megacity Metro Demo now available. Download now.
    Dismiss Notice
  2. Unity support for visionOS is now available. Learn more in our blog post.
    Dismiss Notice

Design a User Interface Panel

Discussion in 'UGUI & TextMesh Pro' started by Aravindadx, Sep 10, 2018.

  1. Aravindadx

    Aravindadx

    Joined:
    Jul 29, 2018
    Posts:
    14
    Hello Everybody,

    I'm Roshan Aravinda who is a student in University of Vocational Technology, Sri Lanka. In these days I'm trying to develop my final project with unity and therefore my project is model the Toyota hybrid vehicle inverted converter with 3D Max and Unity.

    According to this reason I've created few examples for my project. Also this community members help me to do that. Now I want to design a UI panel as follow image.



    Now I need to know few things about above panel.
    1. How do we design a beautiful panel like that one?
    2. What is the way to insert a 3d model (The Gun) into the panel?
    3. How can we get special objects like progress bar into the panel?
    4. Can we animate the things one the panel and how to do it?

    So, I highly appreciate your valuable response for me. Please help me to success my project.

    Thank You!
     
  2. Hosnkobf

    Hosnkobf

    Joined:
    Aug 23, 2016
    Posts:
    1,096
    1. use anchors right. Maybe here and there you would also need some layout components (like aspect ratio fitter)
    2. You cannot really insert 3D stuff into UI. But you can render the 3D stuff normally and just render the UI on top of it (leave space where the model will be displayed). If you really need to have the rendered model in an UI element (which doesn't seem to be the case here) you can render the 3D-Scene into a render texture and display it with a RawImage component in the UI.
    3. Easiest way: add an image (and assign a sprite to it) then change the Image Type to "Filled" with the Fill Method "Horizontal". you can then set the fillAmount of it also via code (value between 0.0f and 1.0f) which will show only a part of the bar.
    4. Yes. You can use the unity animation system or make animations via code (e.g. by using Coroutines - or with the Update method which is a little bit more complex to write)
     
    Aravindadx likes this.
  3. Aravindadx

    Aravindadx

    Joined:
    Jul 29, 2018
    Posts:
    14
    Hello Hosnkobf,

    First of all I would like to thank your valuable response for my thread. Actually I'm not a professional person to handle unity and I will understand your solutions after following many resources and videos. But I would like to ask from you is there any resources like tutorials, videos or some other documentations to fulfill my objectives with unity?

    This is the final project of university and I would like to give my full effort to this project work. As a Sri Lankan, I have to face a huge problem which is our country hasn't professional developers or script writers with unity framework. And also I can't find any professional people. I tried lot.

    So, If you or any member can help me to solve those matter it's a big help for me to success my project work.
    (In past few days I did some simple animations according to my project work with unity.)



    Thank You!
     
  4. Hosnkobf

    Hosnkobf

    Joined:
    Aug 23, 2016
    Posts:
    1,096
    Hi @Aravindadx,

    There are tons of tutorials, videos, books, sample projects and published code out there. I do not know which are good and which not, since I do not really need that (I am working with Unity for some years already...).
    However, I like the wiki of Unity. I also use the Scripting Reference and the Manual sometimes, but I am not a big fan of these because they often lack the information I am looking for.
    If you want to get a basic idea of certain parts of unity, the official tutorials may help (for me they are usually too basic, though).

    This forum here is for explicit questions. So, if you are stuck or not sure how to solve a problem best, you can create a thread here (try to describe your problem as clear as possible).
     
    Aravindadx likes this.
  5. Aravindadx

    Aravindadx

    Joined:
    Jul 29, 2018
    Posts:
    14
    Hello @Hosnkobf,

    Your guidelines are help to me for find the solution in UI panel. So I've crated the below example.



    Now I can handle the Render Texture and Raw Image component. But I need to know about one fact. My project has 6 or 7 models to display in UI panel. But those models I'm not going to display in same time. According to this manner I have to create 6 or 7 cameras to get the Render Texture. But the problem is I think those render textures are in the same scene is not suitable for me. The reason is I have to design my main scene very carefully with few assets.

    So I need to get my models into another scenes for rendertexture. As an example my first rndertexture model is in scene2. But I need to display it with raw image component in scene1. I've tried this method, but the model didn't appear in the UI panel. It's Empty. Now I need to know can I do such kind of thing? Same scene and same rendertextures are works for me perfectly. By the way I appreciate your concern for this post.

    Thank You!