Forums | NoesisGUI

Posted: **28 Nov 2014, 07:57**

So I have uWebKit rendering inside of a noesis imagebrush that is set to a the background of a grid.

Image: http://gyazo.com/dc629f13c68ec8b29ddcac78b6b0901d

I'm trying to figure out how I could pass through my mouse position so I can actually highlight links and scroll down the page and what not.

Below is code that creates the texture that I am setting as the background of the grid and handles all there click through events obviously these wont work in the case of hosting it inside noesis but I am not sure how I would go about passing the right mouse coordinates to the ProcessMouse function. If anyone could help this would be greatly appreciated. uwebkit has a free trial if anyone is willing to help out with this. You can get it here http://uwebkit.com/download/

/******************************************
  * uWebKit 
  * (c) 2014 THUNDERBEAST GAMES, LLC
  * http://www.uwebkit.com
  * [email protected]
*******************************************/

using UnityEngine;
using System.Collections;
using System.Collections.Generic;

/// <summary>
/// Basic example of using a UWKWebView on a 3D Unity surface
/// </summary>
 
// IMPORTANT: Please see the WebGUI.cs example for 2D support

public class WebTexture : MonoBehaviour
{
    
    #region Inspector Fields
    public bool KeyboardEnabled = true;
    public bool MouseEnabled = true;
    public bool Rotate = false;
    public bool HasFocus = true;
    public bool AlphaMask = false;
    #endregion

    UWKWebView view;

    // Use this for initialization
    void Start ()
    {   

        view = gameObject.GetComponent<UWKWebView>();

        view.SetAlphaMask(AlphaMask);

        if (renderer != null)
            renderer.material.mainTexture = view.WebTexture;

        if (guiTexture != null)
            guiTexture.texture = view.WebTexture;

        Noesis.TextureSource ts = new Noesis.TextureSource(view.WebTexture);
        UserControls.MainMenu.instance.gridWeb.Background = new Noesis.ImageBrush(ts);
        
    }
    
    // Update is called once per frame
    void Update ()
    {

        if (Rotate)
            gameObject.transform.Rotate (0, Time.deltaTime * 4.0f, 0);

        if (!MouseEnabled || !HasFocus)
            return;         
            
        RaycastHit rcast;
            
        if (Physics.Raycast (Camera.main.ScreenPointToRay (Input.mousePosition), out rcast)) 
        {
                
            /*if (rcast.collider != GetComponent<MeshCollider> ())
                return;*/
            
            int x = (int)(rcast.textureCoord.x * (float)view.MaxWidth);
            int y = view.MaxHeight - (int)(rcast.textureCoord.y * (float)view.MaxHeight);

            Vector3 mousePos = new Vector3();
            mousePos.x = x; 
            mousePos.y = y;
            view.ProcessMouse(mousePos);  
                                        
        }
        
    }
        
    void OnGUI ()
    {       
        if (!KeyboardEnabled || !HasFocus)
            return;
        
        if (Event.current.isKey)
        {
            view.ProcessKeyboard(Event.current);
        }
        
    }
        
}

Posted: **01 Dec 2014, 14:26**

Hi, sorry for the late answer.

You have two options to transform the mouse coordinates:

1) In your Update function, transform the x,y mouse position using the element that is rendering the WebKit texture:

void Update ()
{
    // ...

    // Assuming you are rendering NoesisGUI on top of the screen (NoesisGUIPanel attached to MainCamera):
    float x = UnityEngine.Input.mousePosition.x;
    float y = UnityEngine.Screen.height - UnityEngine.Input.mousePosition.y;

    Noesis.Point pos = UserControls.MainMenu.instance.gridWeb.PointFromScreen(new Noesis.Point(x,y));
    view.ProcessMouse(new Vector3(pos.x, pos.y));

    // ...
}

2) The second option is to manage everything inside the UserControl that is rendering the WebKit texture.

You can expose a property in your UserControl to set the WebKit texture, where you can create the TextureSource and assign it to the corresponding UI element.

public WebKitControl : Noesis.UserControl
{
    Noesis.Grid _grid;

    public void OnPostInit()
    {
        _grid = (Noesis.Grid)FindName("grid");
    }

    UWKWebView _view;
    public UWKWebView WebKitView
    {
        get { return _view; }
        set
        {
            _view = value;

            if (_view != null && _view.WebTexture != null)
            {
                Noesis.TextureSource tex = new Noesis.TextureSource(_view.WebTexture);
                _grid.Background = new Noesis.ImageBrush(tex);
            }
            else
            {
                _grid.Background = null;
            }
        }
    }
}

And attach to element events to translate mouse coordinates:

public void OnPostInit()
{
    _grid = (Noesis.Grid)FindName("grid");
    _grid.MouseMove += OnMouseMove;
    _grid.MouseDown += OnMouseDown;
    _grid.MouseUp += OnMouseUp;
}

private void OnMouseMove(object sender, MouseEventArgs e)
{
    Noesis.Point pos = _grid.PointFromScreen(e.position);
    _view.ProcessMouse(new Vector3(pos.x, pos.y));
}

private void OnMouseDown(object sender, MouseButtonEventArgs e)
{
    // ...
}

private void OnMouseUp(object sender, MouseButtonEventArgs e)
{
    // ...
}

I think the second option is better, because that way you can reuse the WebKitControl in many parts of your GUI.

Posted: **01 Dec 2014, 18:05**

Perfect! You guys customer support continues to amaze me. This worked perfectly thanks a lot.

Posted: **02 Dec 2014, 13:00**

It would be great if you could share your results with the rest of the community in the Showcase section.

Thanks

Posted: **27 Dec 2014, 20:40**

It would be great if you could share your results with the rest of the community in the Showcase section.

Thanks

I posted an example to the showcase page. With that being said fernandez do you think you could help me at some point with having uwebkit dynamically size to the grid it will be going in? Right now I'm using a viewbox with Stretch="Fill" because if I don't use that the page won't scroll properly or look right. I was wondering if there is a way to get the grid size that I want it to go in and then set the height and width of the webkit texture based off of that and that should fix my problem any help is appreciated.

Posted: **29 Dec 2014, 13:59**

Continuing with my previous example, you can detect when the WebKitControl changes its size and update WebKit View size:

public WebKitControl : Noesis.UserControl
{
    // ...

    public void OnPostInit()
    {
        // ...
        _grid.SizeChanged += OnSizeChanged;
    }

    private void OnSizeChanged(Noesis.BaseComponent sender, Noesis.SizeChangedEventArgs e)
    {
        int w = (int)e.sizeChangedInfo.newSize.width;
        int h = (int)e.sizeChangedInfo.newSize.height;
        _view.SetCurrentSize(w, h);
    }
}

Regards,
-Sergio

Posted: **30 Dec 2014, 04:40**

Yeah I tried doing what you posted above and it doesn't seem to give the right result. I'm going to put together an example project and send it over to you guys to see if I'm just doing something really stupid.

Thanks

Posted: **05 Jan 2015, 16:53**

Please create a ticket in our bugtracker and attach your project so we can determine what is the source of the problem.

Thanks for your feedback.

Forums | NoesisGUI

uwebkit inside noesis

uwebkit inside noesis

Re: uwebkit inside noesis

Re: uwebkit inside noesis

Re: uwebkit inside noesis

Re: uwebkit inside noesis

Re: uwebkit inside noesis

Re: uwebkit inside noesis

Re: uwebkit inside noesis