首款国产AI IDE出世
本帖最后由 马黑黑 于 2025-3-4 13:27 编辑字节跳动旗下的产品：Trae IDE。
Trae是一个IDE编辑器，分成两部分，编辑器+AI。你可以用它来写代码，并随时得到AI的帮助。AI以两种方式协助你写代码，一种是 Trae-Chat 聊天模式，另一种是 Builder 工程模式，前者和你询问第三方AI代码差不多，需要将它给的结果复制到IDE编辑器，不同的是它们并排放在一起，后者跟进你的工程，直接操作你编辑器里的代码，目前处于Beta阶段。
Trae 最先在新加坡运营，接入的大模型是国外的产品（如OpenAI）。自3月3日起，Trae 接入了 DeepSeek，并在国内运营，限时免费。中文版 Trae 可以不登录使用，但只能用它的编辑器功能，AI用不了，所以还是要登录。如果你有 Google 账号或GitHub 账号，用它们登录就行，如果没有，可以注册一个 Trae 账号再登录，用国内的邮箱就行，注册时需要登录邮箱拿到验证码。不论用什么账号登录，都需要科学上网，否则无法成功登录，原因是登录的Web不在国内，页面拒绝来自中国大陆的ID登录。
登录成功后，就可以不用科学上网了，不过要确保所安装的 Trae 是3月3日或以后推出的版本，不是的话升级一下，不然呢AI还是用不了。
字节跳动可能出于某种不好解释的原因，trae 没有做成纯粹国产软件的机制。可能一切和地缘有关，但相信这类机制以后不复存在。
PS：Trae 对硬件环境要求不低，硬件性能偏低的机器跑起来可能会很慢。如果条件不理想，感兴趣的也可以尝试一下，然后觉得玩不起了再卸掉它。
<h3>以下是 Trae 针对DS时钟添加了一个暂停、继续按钮：</h3>
<!DOCTYPE html>
<html>
<head>
<style>
.clock_wrapper {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width: 100%;
min-height: 640px;
background: #f0f0f0;
margin: 0 auto;
}
#pauseBtn {
margin-top: 20px;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
background: #4CAF50;
color: white;
border: none;
border-radius: 4px;
}
#pauseBtn:hover {
background: #45a049;
}
</style>
</head>
<body>
<div class="clock_wrapper">
<canvas id="clock" width="400" height="400"></canvas>
<button id="pauseBtn">暂停</button>
</div>
<script>
// ... 现有代码 ...
const canvas = document.getElementById('clock');
const ctx = canvas.getContext('2d');
// 高清屏适配
const scale = window.devicePixelRatio || 1;
canvas.width = 400 * scale;
canvas.height = 400 * scale;
ctx.scale(scale, scale);
let isPaused = false;
let lastTime = null;
let pausedTime = null;
pauseBtn.addEventListener('click', () => {
isPaused = !isPaused;
pauseBtn.textContent = isPaused ? '继续' : '暂停';
if (!isPaused) {
lastTime = new Date();
pausedTime = null;
requestAnimationFrame(drawClock);
} else {
pausedTime = new Date();
}
});
function drawClock() {
// 清除画布
ctx.clearRect(0, 0, canvas.width, canvas.height);
// 获取当前时间
let now;
if (isPaused && pausedTime) {
now = pausedTime;
} else {
now = new Date();
}
const hours = now.getHours() % 12;
const minutes = now.getMinutes();
const seconds = now.getSeconds();
const milliseconds = now.getMilliseconds();
// 表盘样式
const centerX = canvas.width / 2 / scale;
const centerY = canvas.height / 2 / scale;
const radius = Math.min(centerX, centerY) - 10;
// 绘制表盘背景
const gradient = ctx.createRadialGradient(
centerX, centerY, 0, centerX, centerY, radius
);
gradient.addColorStop(0, '#f8f8f8');
gradient.addColorStop(1, '#e0e0e0');
ctx.fillStyle = gradient;
ctx.beginPath();
ctx.arc(centerX, centerY, radius, 0, Math.PI * 2);
ctx.fill();
// 绘制边框
ctx.strokeStyle = 'linear-gradient(45deg, #666, #999)';
ctx.lineWidth = 8;
ctx.beginPath();
ctx.arc(centerX, centerY, radius - 4, 0, Math.PI * 2);
ctx.stroke();
// 绘制小时刻度
ctx.lineWidth = 3;
ctx.strokeStyle = '#333';
for (let i = 0; i < 12; i++) {
ctx.save();
ctx.translate(centerX, centerY);
ctx.rotate(i * 30 * Math.PI / 180);
ctx.beginPath();
ctx.moveTo(0, -radius + 20);
ctx.lineTo(0, -radius + 40);
ctx.stroke();
ctx.restore();
}
// 绘制分钟刻度
ctx.lineWidth = 1;
ctx.strokeStyle = '#666';
for (let i = 0; i < 60; i++) {
if (i % 5 === 0) continue;
ctx.save();
ctx.translate(centerX, centerY);
ctx.rotate(i * 6 * Math.PI / 180);
ctx.beginPath();
ctx.moveTo(0, -radius + 25);
ctx.lineTo(0, -radius + 35);
ctx.stroke();
ctx.restore();
}
// 绘制数字
ctx.font = '16px Arial';
ctx.fillStyle = '#333';
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
for (let i = 1; i <= 12; i++) {
const angle = i * 30 * Math.PI / 180;
const x = centerX + Math.sin(angle) * (radius - 60);
const y = centerY - Math.cos(angle) * (radius - 60);
ctx.fillText(i.toString(), x, y);
}
// 计算指针角度
const secondAngle = (seconds + milliseconds / 1000) * 6;
const minuteAngle = (minutes + seconds / 60) * 6;
const hourAngle = (hours + minutes / 60) * 30;
// 绘制时针
ctx.save();
ctx.translate(centerX, centerY);
ctx.rotate(hourAngle * Math.PI / 180);
ctx.fillStyle = '#333';
ctx.shadowColor = 'rgba(0,0,0,0.2)';
ctx.shadowBlur = 8;
ctx.shadowOffsetY = 3;
ctx.beginPath();
ctx.moveTo(-4, 0);
ctx.lineTo(0, -radius * 0.5);
ctx.lineTo(4, 0);
ctx.arc(0, 0, 4, 0, Math.PI * 2);
ctx.fill();
ctx.restore();
// 绘制分针
ctx.save();
ctx.translate(centerX, centerY);
ctx.rotate(minuteAngle * Math.PI / 180);
ctx.fillStyle = '#666';
ctx.beginPath();
ctx.moveTo(-3, 0);
ctx.lineTo(0, -radius * 0.7);
ctx.lineTo(3, 0);
ctx.arc(0, 0, 3, 0, Math.PI * 2);
ctx.fill();
ctx.restore();
// 绘制秒针
ctx.save();
ctx.translate(centerX, centerY);
ctx.rotate(secondAngle * Math.PI / 180);
ctx.strokeStyle = '#e74c3c';
ctx.lineWidth = 2;
ctx.beginPath();
ctx.moveTo(0, radius * 0.1);
ctx.lineTo(0, -radius * 0.8);
ctx.stroke();
ctx.restore();
// 绘制中心圆点
ctx.beginPath();
ctx.fillStyle = '#e74c3c';
ctx.arc(centerX, centerY, 4, 0, Math.PI * 2);
ctx.fill();
if (!isPaused) {
requestAnimationFrame(drawClock);
}
}
drawClock();
</script>
</body>
</html>
看样子又是一个智能程序，接入了DS限时免费使用。。
看白老师登用过程是层层关卡，能到最后顺利登陆并用，很不容易。。
感觉只有大神才玩得转。。
{:4_173:} 不论用什么账号登录，都需要科学上网，否则无法成功登录。。
矮油，这个科学上网学问很大。。。
还拒绝大陆ID，要有梯子的节奏哇{:4_170:} 这个时钟还能暂停呢，看得笑。暂停了而实际时间并不同，重新开始就直接跳到正确时间上去了呢{:4_204:} 马黑黑 发表于 2025-3-4 14:01
以下是 Trae 针对DS时钟添加了一个暂停、继续按钮：
这个时钟暂停很强悍，它停是能停，继续后跳到即时时间。。
虽困在原地，但还是牢牢记得自己的位置{:4_173:} 这个注册看着还挺麻烦，不会科学上网，还是算了{:4_173:} 红影 发表于 2025-3-4 18:52
这个注册看着还挺麻烦，不会科学上网，还是算了
过阵子吧，应该都可以注册 花飞飞 发表于 2025-3-4 18:51
这个时钟暂停很强悍，它停是能停，继续后跳到即时时间。。
虽困在原地，但还是牢牢记得自己的位置{:4_17 ...
这个必须吧，就像自动对时的石英钟一样的 红影 发表于 2025-3-4 18:51
这个时钟还能暂停呢，看得笑。暂停了而实际时间并不同，重新开始就直接跳到正确时间上去了呢
这个是必须的 花飞飞 发表于 2025-3-4 18:46
看样子又是一个智能程序，接入了DS限时免费使用。。
看白老师登用过程是层层关卡，能到最后顺利登陆并用， ...
不是的，只要会科学上网就行的
马黑黑 发表于 2025-3-4 18:53
这个必须吧，就像自动对时的石英钟一样的
代码赋予的吧。。。
这个偏门的人工智能程序还是很厉害的呗。。{:4_173:} 花飞飞 发表于 2025-3-4 18:48
不论用什么账号登录，都需要科学上网，否则无法成功登录。。
矮油，这个科学上网学问很大。。。
还拒绝大 ...
对，需要一把梯子 马黑黑 发表于 2025-3-4 18:54
不是的，只要会科学上网就行的
你这贴子里隔几句就说：要咋咋，否则用不了。。强调了好几次。。
边看边想，这好难啊。。
这太不科学了。。{:4_173:} 马黑黑 发表于 2025-3-4 18:55
对，需要一把梯子
有梯子才可以上墙头{:4_173:}风景那里独好 花飞飞 发表于 2025-3-4 18:55
代码赋予的吧。。。
这个偏门的人工智能程序还是很厉害的呗。。
这个不偏门。IDE是写代码的人都用的（例如鼎鼎有名的免费的VSCode），人工智能用于IDE则是必须的，字节跳动在国内是首个发布了这个东东。
顺便说一下，今日头条、抖音、tiktop等等就是字节跳动的产品 马黑黑 发表于 2025-3-4 18:53
过阵子吧，应该都可以注册
嗯嗯，等它放开了再说了。 红影 发表于 2025-3-4 19:02
嗯嗯，等它放开了再说了。
现在是半开放阶段，给有梯子的人使用 马黑黑 发表于 2025-3-4 18:54
这个是必须的
这个挺厉害的。感觉刻度和数字都大了点，不够纤巧{:4_173:} 红影 发表于 2025-3-4 19:03
这个挺厉害的。感觉刻度和数字都大了点，不够纤巧
它加了一些CSS、HTML和JS，我也没细看代码。期间运行不成功，我就跟它说无法运行，它就又改了一下，然后就是酱紫，我也觉得不太对，只是有事情要处理不能再玩了，就赶紧放上来