fromJson static method

SanityImage fromJson(
  1. Map<String, dynamic> json
)

Parses json into a SanityImage. accepts either a Sanity Image which would look like this: query would look like: *[_type=='meditation']{image}

"_type": "image",
"asset": {
  "_ref": "image-38de0164654e709a07ca57d0d7d3ab29ce187dd5-1200x800-jpg",
  "_type": "reference"
}

also accepts a Sanity Image as the expanded asset: query would look like *[_type=='meditation']{'image': image.asset->}

{
  "_id": "image-38de0164654e709a07ca57d0d7d3ab29ce187dd5-1200x800-jpg",
  "_type": "sanity.imageAsset",
  "metadata": {
    "lqip": ...,
    "palette": {
      ...
    }
  },
  ...
}

the required attributes that should be in the json to be able to display the image are:

  • _ref if it is a image.
  • _id if it is an asset. The third option to make use of both crop and the metadata of the image is to make this query: *[_type=='meditation']{'image': {'image': image, 'asset': image.asset->}} with this query it is possible to:
  • use crop and hotspot
  • use lqip
  • use the image palette

Implementation

static SanityImage fromJson(Map<String, dynamic> json) {
  // an image is passed.
  if (json['asset']?['_ref'] != null) {
    return _fromImageQuery(json);
  }

  // an asset is passed.
  if (json['_id'] != null) {
    return _fromAssetQuery(json);
  }

  // both are passed.
  if (json['image'] != null && json['asset'] != null) {
    return _fromBothQuery(json);
  }

  // nothing matched.
  throw Exception(
      'unable to parse SanityImage from ${json.toString()}, try to change your query.');
}