
回复
在现代翻译工具中,灵活的输入与多语言的输出已经成为不可或缺的特性。通过AI大模型的支持,这款翻译工具不仅允许手动输入内容,还能生成句子或诗歌作为输入,系统会将这些内容翻译为多种目标语言,让用户体验到语言自由转换的强大功能。
工具界面简洁直观,用户可以选择生成内容作为输入,或手动输入需要翻译的文本。翻译结果会显示在输出框中,支持多种语言切换。
效果预览:
build() {
Flex({
direction: FlexDirection.Column,
justifyContent: FlexAlign.SpaceBetween,
alignItems: ItemAlign.Center
}) {
// 输出框
Scroll() {
Column() {
Text(this.resultText)
.fontColor(Color.White)
.fontSize(16)
.padding(15)
.backgroundColor(SCROLL_COLOR)
.borderRadius(15)
.textAlign(TextAlign.Center)
.width('80%')
.height('60%');
}
.padding({ top: 10, bottom: 20 });
}
.scrollBarWidth(0)
.scrollBarColor(Color.Transparent);
// 按钮区域
Flex({ direction: FlexDirection.Row, justifyContent: FlexAlign.Center }) {
ForEach(this.buttonLabels, (label: string, index: number) => {
CustomButton({
buttonLabel: label,
buttonColor: this.buttonColors[index]
})
.onClick(() => this.fetchChatResponse(this.buttonLabels[index]))
.margin({ left: 10, right: 10, top: 5, bottom: 5 });
});
}
.width('100%')
.height('20%');
// 输入框
TextInput({ text: this.inputText, placeholder: '输入内容...' })
.onChange((value) => this.inputText = value)
.backgroundColor(TEXT_INPUT_COLOR)
.fontColor(Color.White)
.fontSize(16)
.padding(15)
.borderRadius(15)
.width('80%')
.height('10%')
.margin({ top: 20 });
}
.padding(10);
}
工具支持两种主要输入方式:
效果预览:
public async generateTextAndAccumulate(
modelService: ModelIntegrationService,
inputText: string,
contentCategory: string
): Promise<string> {
let accumulatedResult = '';
this.resultText = ''; // 重置结果显示框
await modelService.generateText(
inputText,
contentCategory,
(partialResult: string) => {
accumulatedResult += partialResult; // 累加每个分块的结果
this.resultText += partialResult; // 实时更新结果显示框
}
);
return accumulatedResult; // 返回累积的完整结果
}
工具支持多语种翻译,用户可以在“英”、“日”、“韩”、“法”、“葡”等目标语言之间自由切换。用户可以通过生成的句子或诗歌作为输入,选择任意目标语言进行翻译。
效果预览:
await modelService.generateText(
inputText,
contentCategory,
(partialResult: string) => {
accumulatedResult += partialResult;
this.resultText += partialResult; // 实时更新显示框
}
);
每次点击按钮时,系统会生成不同的内容。按钮的颜色和标签是随机生成的,为用户提供变化多样的视觉反馈,操作过程变得更加有趣和互动。
public getButtonColors(): string[] {
const colors = [
"#FEE2E2", "#C7D2FE", "#D1FAE5", "#FDE68A", "#BFDBFE",
"#FBCFE8", "#A7F3D0", "#F9A8D4", "#FDE047", "#C084FC",
"#F3B6F8", "#A0E4B0", "#FFE1A8", "#B5D3FC", "#E4C1F9"
];
return this.shuffleArray(colors);
}
这款翻译工具通过生成内容作为输入并结合多语种翻译输出,为用户提供了灵活且个性化的翻译体验。用户可以自由选择自动生成的句子或诗歌,或通过手动输入文本进行翻译,并在多种语言之间自由切换。无论是生成内容还是手动输入,翻译结果都将在输出框中实时显示,每次操作都充满了语言的创造与互动。