用HBuilder X写一个渐变长方形里面左边插入一张图片右边再有两个小矩形

在HBuilder X（DCloud的IDE）中创建一个渐变背景的长方形，并在其左侧插入图片，右侧放置两个小矩形，可以按照以下步骤操作：

1. **新建界面布局**：
- 打开HBuilder X项目，选择你需要添加此设计的界面文件。
- 选择"自定义视图"或者"XML布局"，开始编写XML代码。

2. **设置根元素**：

   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       android:orientation="horizontal">

3. **渐变长方形**：
- 创建一个`View`作为长方形并设置其背景颜色渐变：

     <View
         android:id="@+id/main_rectangle"
         android:layout_width="0dp"
         android:layout_weight="1"
         android:layout_height="match_parent"
         android:background="?attr/colorPrimary"
         android:elevation="5dp"/>

- 或者你可以直接使用`GradientDrawable`创建一个带颜色过渡的长方形。

4. **图片插入**：
- 添加一个ImageView到长方形左侧：

        <ImageView
            android:id="@+id/image_view"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/your_image"
            android:layout_gravity="start"/>

- 替换`@drawable/your_image`为你的实际图片资源。

5. **小矩形**：
- 在长方形右侧添加两个较小的`View`，设置宽度（如`wrap_content`）和高度（如`50dp`）：

        <View
            android:id="@+id/small_rectangle1"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:layout_marginStart="16dp"
            android:background="#ff0000"/>

        <View
            android:id="@+id/small_rectangle2"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:layout_marginStart="8dp"
            android:background="#00ff00"/>

- 更改颜色值为你喜欢的颜色。

6. **运行预览**：
- 在HBuilder X中点击预览按钮，检查布局是否符合预期。

记得替换上述代码中的图片路径、颜色值等为你实际的需求。如果你需要进一步的帮助或有其他问题，请告诉我。