imgix_client

Description:

imgix client

Imgix Dart Client #


A Dart client library for generating URLs with imgix.







Install
Basic Usage
Signed URLs
Srcset Generation
Running Tests
Features and bugs

Install #
dependencies:
imgix_client: ^1.0.0
copied to clipboard
Basic Usage #
A simple usage example:
import 'package:imgix_client/imgix_client.dart';

void main() {
var urlBuilder = UrlBuilder('demos.imgix.net');
var params = { 'w': '100', 'h': '100' };
print('awesome: ${urlBuilder.createURL('bridge.png', params)}');
}

// Prints out:
// https://demos.imgix.net/bridge.png?h=100&w=100
copied to clipboard
HTTPS support is available by default. However, if you need HTTP support, call setUseHttps on the builder:
import 'package:imgix_client/imgix_client.dart';

void main() {
var builder = UrlBuilder('demos.imgix.net');
builder.useHttps = false; // use http

var params = { 'w': '100', 'h': '100' };
print(builder.createURL("bridge.png", params));
}


// Prints out
// http://demos.imgix.net/bridge.png?h=100&w=100
copied to clipboard
Signed URLs #
To produce a signed URL, you must enable secure URLs on your source and then
provide your signature key to the URL builder.
import 'package:imgix_client/imgix_client.dart';

void main() {
var builder = UrlBuilder('demos.imgix.net');
builder.useHttps = false; // use http
builder.signKey = 'test1234'; // set sign key

var params = { 'w': '100', 'h': '100' };
print(builder.createURL("bridge.png", params));
}


// Prints out
// http://demos.imgix.net/bridge.png?h=100&w=100&s=bb8f3a2ab832e35997456823272103a4
copied to clipboard
Srcset Generation #
The imgix-java library allows for generation of custom srcset attributes, which can be invoked through createSrcSet(). By default, the srcset generated will allow for responsive size switching by building a list of image-width mappings.
import 'package:imgix_client/imgix_client.dart';

void main() {
var ub = UrlBuilder('demos.imgix.net', true, 'my-token', false);
var srcset = ub.createSrcSet("bridge.png");

print(srcset);
}
copied to clipboard
Will produce the following attribute value, which can then be served to the client:
https://demos.imgix.net/bridge.png?w=100&s=494158d968e94ac8e83772ada9a83ad1 100w,
https://demos.imgix.net/bridge.png?w=116&s=6a22236e189b6a9548b531330647ffa7 116w,
https://demos.imgix.net/bridge.png?w=134&s=cbf91f556dd67c0b9e26cb9784a83794 134w,
...
https://demos.imgix.net/bridge.png?w=7400&s=503e3ba04588f1c301863c9a5d84fe91 7400w,
https://demos.imgix.net/bridge.png?w=8192&s=152551ce4ec155f7a03f60f762a1ca33 8192w
copied to clipboard
In cases where enough information is provided about an image's dimensions, createSrcSet() will instead build a srcset that will allow for an image to be served at different resolutions. The parameters taken into consideration when determining if an image is fixed-width are w (width), h (height), and ar (aspect ratio). By invoking createSrcSet() with either a width or the height and aspect ratio (along with fit=crop, typically) provided, a different srcset will be generated for a fixed-size image instead.
import 'package:imgix_client/imgix_client.dart';

void main() {
var ub = UrlBuilder('demos.imgix.net', true, 'my-token', false);
var params = { 'h': '200', 'ar': '3:2', 'fit': 'crop' };
var srcset = ub.createSrcSet("bridge.png", params);

print(srcset);
}
copied to clipboard
Will produce the following attribute value:
https://demos.imgix.net/bridge.png?ar=3%3A2&dpr=1&fit=crop&h=200&s=4c79373f535df7e2594a8f6622ec6631 1x,
https://demos.imgix.net/bridge.png?ar=3%3A2&dpr=2&fit=crop&h=200&s=dc818ae4522494f2f750651304a4d825 2x,
https://demos.imgix.net/bridge.png?ar=3%3A2&dpr=3&fit=crop&h=200&s=ba1ec0cef6c77ff02330d40cc4dae932 3x,
https://demos.imgix.net/bridge.png?ar=3%3A2&dpr=4&fit=crop&h=200&s=b51e497d9461be62354c0ea12b6524fb 4x,
https://demos.imgix.net/bridge.png?ar=3%3A2&dpr=5&fit=crop&h=200&s=dc37c1fbee505d425ca8e3764b37f791 5x
copied to clipboard
For more information to better understand srcset, we recommend Eric Portis' "Srcset and sizes" article which goes into depth about the subject.
Features and bugs #
Please file feature requests and bugs at the issue tracker.
Running Tests #
To run tests clone this project and run:
pub run test
copied to clipboard