#HarmonyOS NEXT体验官# 打造飞速智能体验：鸿蒙系统上的大模型交互新境界 原创

@Component
struct CustomButton {
  @Prop buttonTexts: string[];
  @Prop index: number;
  @Prop buttonColor: string;

  build() {
    Button(this.buttonTexts[this.index])
      .width('match_content')
      .height('match_content')
      .backgroundColor(this.buttonColor)
      .fontColor("#1E293B")
      .fontSize(18)
      .borderRadius(25) // 调整圆角半径，使按钮更圆润
      .shadow({ color: 'rgba(0, 0, 0, 0.2)', offsetX: 0, offsetY: 5, radius: 10 }) // 使用正确的shadow参数
      .padding({
        top: 12,
        bottom: 12,
        left: 20,
        right: 20
      })
      .margin({ bottom: 10 }); // 增加按钮之间的间隔
  }
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.

private interactWithModelAndStream(instruction: string, buttonCount: number): Promise<string> {
    return new Promise((resolve, reject) => {
      let fullResult = '';

      this.resultText = '';
      this.modelService.interactWithModel(
        instruction,
        http.RequestMethod.POST,
        60000,
        {},
        (chunk: string) => {
          this.resultText += chunk;
          fullResult += chunk;
        }
      );

      setTimeout(() => {
        resolve(fullResult);
      }, 10000);
    });
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.

export function makeHttpRequest(
  url: string,
  method: http.RequestMethod,
  body: RequestBody,
  timeout: number = 60000,
  customHeaders: HttpHeaders = {},
  onDataReceive: (chunk: string) => void
): Promise<void> {
  return new Promise<void>((resolve, reject) => {
    let httpRequest = http.createHttp();

    // 手动合并 header 对象
    let headers: HttpHeaders = {
      'Content-Type': 'application/json; charset=utf-8'
    };

    // 使用 Object.keys 遍历并合并 customHeaders
    Object.keys(customHeaders).forEach(key => {
      headers[key] = customHeaders[key];
    });

    let options: http.HttpRequestOptions = {
      method: method,
      extraData: body,
      connectTimeout: timeout,
      readTimeout: timeout,
      expectDataType: http.HttpDataType.STRING,
      usingCache: true,
      priority: 1,
      usingProtocol: http.HttpProtocol.HTTP1_1,
      usingProxy: false,
      header: headers // 使用合并后的 header
    };

    httpRequest.on('dataReceive', (data: ArrayBuffer) => {
      const chunk = utf8ArrayToStr(new Uint8Array(data));

      try {
        const jsonResponse: ChatResponse = JSON.parse(chunk);
        if (jsonResponse.message && jsonResponse.message.content) {
          onDataReceive(jsonResponse.message.content);
        }
      } catch (error) {
        console.error('Failed to parse JSON:', error);
        onDataReceive(chunk); // 如果解析 JSON 失败，仍然将原始数据传递出去
      }
    });

    httpRequest.on('dataEnd', () => {
      resolve();
    });

    httpRequest.requestInStream(url, options).catch((err: BusinessError) => {
      reject(err);
    });
  });
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.

private generateQuestionsPrompt(selectedTopic1: string): string {
    const selectedTopic =
      selectedTopic1 ? selectedTopic1 : this.predefinedTopics[Math.floor(Math.random() * this.predefinedTopics.length)];

    return `
        请根据以下主题生成${this.buttonCount}个相关的问题：
        每个问题不超过15字，以换行符分隔。
        只用中文，不得含有数字、序号或特殊字符：

        主题：
        ${selectedTopic}

        注意：问题必须与主题相关，简洁明了。
    `;
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.

private getButtonColors(): string[] {
    const colors = [
      "#FEE2E2", "#C7D2FE", "#D1FAE5", "#FDE68A", "#BFDBFE",
      "#FBCFE8", "#A7F3D0", "#F9A8D4", "#FDE047", "#C084FC"
    ];

    const shuffledColors = colors.sort(() => Math.random() - 0.5);
    return shuffledColors;
}
1.
2.
3.
4.
5.
6.
7.
8.
9.