<Card size="sm">  {/* Create a small size card container as the main framework of the Widget */}
    <Col gap={2}>  {/* Vertical layout container with a child element spacing of 2 units */}
      {/* Title area */}
      <Title value="Tomorrow weather" size="md" />  {/* Display the Widget heading with medium font size */}
      
      {/* Location and weather status line */}
      <Row gap={2}>  {/* Horizontal layout container with a child element spacing of 2 units */}
        <Icon name="map-pin" size="sm" color="secondary" />  {/* Location icon, small size, secondary color */}
        <Text value={city} size="sm" color="secondary" />  {/* city name, bind to city variable */}
        <Spacer />  {/* Flexible blank area that pushes subsequent elements to the right */}
        <Badge label={condition} color="info" />  {/* weather condition tag, bind to condition variable */}
      </Row>
      
      {/* Temperature info row */}
      <Row gap={2}>  {/* Horizontal layout container with a child element spacing of 2 units */}
        <Text value={`Temperature ${temp}°C`} size="sm" />  {/* Current temperature, using template string to bind temp variable */}
        <Spacer />  {/* Flexible blank area that pushes subsequent elements to the right */}
        <Caption value={`Max ${high}°C • Min ${low}°C`} />  {/* High and low temperature, small text */}
      </Row>
    </Col>
    
    <Divider />  {/* Split line, separate content areas */}
    
    {/* Clothing advice area */}
    <Col gap={1}>  {/* Vertical layout container with small spacing */}
      <Caption value="Clothing Advice" />  {/* Section heading */}
      <Text value={advice} size="sm" color="secondary" />  {/* Clothing advice content, bound to the advice variable */}
    </Col>
</Card>

{
  "$schema": "https://json-schema.org/draft/2020-12/schema",  // Specify JSON Schema version
  "type": "object",  // Root data type is an object
  "properties": {  // Define the attribute structure of the definition object
    "city": {
      "type": "string"  // City name, string type
    },
    "condition": {
      "type": "string"  // Weather condition, string type (for example: sunny, multi-cloud, rainy)
    },
    "temp": {
      "type": "string"  // Current temperature, string type (includes measurement unit, for example: 25°C)
    },
    "high": {
      "type": "string"  // Highest temperature, string type (includes measurement unit)
    },
    "low": {
      "type": "string"  // Lowest temperature, string type (includes measurement unit)
    },
    "advice": {
      "type": "string"  // Dressing advice, string type (suggestion based on temperature)
    }
  },
  "required": [  // List of required fields, all fields are necessary
    "city",      // City name required
    "condition", // Weather condition required
    "temp",      // Current temperature required
    "high",      // Highest temperature required
    "low",       // Lowest temperature required
    "advice"     // Clothing advice required
  ],
  "additionalProperties": false  // Prohibit addition of undefined additional attributes, ensure data strict
}

{
  city: 'Shenzhen',
  condition: 'cloudy',
  temp: '14',
  high: '18',
  low: '10',
  advice: 'Wear a sweater or thick coat, carry an umbrella when going out, and pay attention to temperature changes.'
}