SmartMan中的「wrap」three.js

我想在Smart Mobile Studio中添加這個簡單的three.js示例。是否有可能沒有很多複雜的包裝？我試圖通過將window.onload內容複製到一個asm部分嘗試一個天真的嘗試 - 但當然沒有運氣。SmartMan中的「wrap」three.js

<!DOCTYPE html> 
<html> 
<head> 
<title>Getting Started with Three.js</title>  
<script src="three.min.js"></script> 
<script> 
window.onload = function() { 

    var renderer = new THREE.WebGLRenderer(); 
    renderer.setSize(800, 600); 
    document.body.appendChild(renderer.domElement); 

    var scene = new THREE.Scene(); 

    var camera = new THREE.PerspectiveCamera(
     35,    // Field of view 
     800/600,  // Aspect ratio 
     0.1,   // Near plane 
     10000   // Far plane 
    ); 
    camera.position.set(-15, 10, 10); 
    camera.lookAt(scene.position); 

    var geometry = new THREE.CubeGeometry(5, 5, 5); 
    var material = new THREE.MeshLambertMaterial({ color: 0xFF0000 }); 
    var mesh = new THREE.Mesh(geometry, material); 
    scene.add(mesh); 

    var light = new THREE.PointLight(0xFFFF00); 
    light.position.set(10, 0, 10); 
    scene.add(light); 

    renderer.render(scene, camera); 

}; 
</script> 
</head> 
<body></body> 
</html>

來源

2014-02-24 Flemming

你試圖避免什麼包裝？ – Shiva

包裝不需要非常困難。您可以定義一個Smart Pascal類，並使用「external」指令將其鏈接到相應的JS類。看看Box2d演示。我還沒有看過three.js源代碼，所以我不知道創建封裝器有多容易，但是我知道André（在Smart-team上）正在看這個馬上。也許他會設法爲你創造一個完整的包裝:-) –

我產生一個包裝單元（用我自己的實驗內部打字稿帕斯卡轉換器），也測試了輸出（和修正了一些發電機錯誤）： https://github.com/andremussche/AndrewsDelphiStuff/tree/master/Smart/ThreeJS

還不夠完善（一些外部類名失蹤），但無論如何這是一個好的起點。

在上面的演示中，你還可以看到如何在SMS IDE :)

來源

2014-02-26 13:57:40

哇 - 這太神奇了！你只是包裝three.js :-)豎起大拇指！我認爲智能移動工作室有這麼多潛力。我一直在尋找box2d演示，希望能夠學習如何製作自己的小包裝，但這對我來說很難理解。特別是因爲js文件被縮小。我會欣賞一個更加大腦友好的例子;-)但無論如何 - 我越深入挖掘短信，我越喜歡它:-) – Flemming

編譯有一個小問題;它有使短信崩潰的傾向！？我必須刪除www文件夾才能在編譯後不會崩潰。 – Flemming

謝謝:)你能重現崩潰嗎？ –

我創建了一個演示，它故意偏離儘可能少安德烈的樣品創建一個普通的HTML項目。更多詳細信息，請參閱：http://smartmobilestudio.com/forums/topic/smartms-intro-with-threejs/

來源

2014-02-27 12:08:49 warleyalex

@warleyalex你的例子是韋裏啓發我。 getID函數正是我需要的！但不幸的是，這也讓短信崩潰。幾乎和André的解決方案一樣。

function getID(OwnerHandle : TObject): string; 
begin 
    result := TW3TagObj(OwnerHandle).Handle.id; 
end; 

procedure TForm1.W3ButtonRunClick(Sender: TObject); 
var canvas : variant; 
begin 
    canvas := getID(myCanvas); // myCanvas is a TW3DIVHtmlElement 
    asm 
    var renderer = new THREE.WebGLRenderer(); 
    renderer.setSize(800, 600); 
    var ctnEl = document.getElementById(@canvas); 
    ctnEl.appendChild(renderer.domElement); 

    var scene = new THREE.Scene(); 

    var camera = new THREE.PerspectiveCamera(
     35,    // Field of view 
     800/600,  // Aspect ratio 
     0.1,   // Near plane 
     10000   // Far plane 
     ); 
     camera.position.set(-15, 10, 10); 
     camera.lookAt(scene.position); 

     var geometry = new THREE.CubeGeometry(5, 5, 5); 
     var material = new THREE.MeshLambertMaterial({ color: 0xFF0000 }); 
     var mesh = new THREE.Mesh(geometry, material); 
     scene.add(mesh); 

     var light = new THREE.PointLight(0xFFFF00); 
     light.position.set(10, 0, 10); 
     scene.add(light); 

     renderer.render(scene, camera);    
    end; 
end;

來源

2014-02-27 21:33:07 Flemming

SmartMan中的「wrap」three.js

回答

相關問題