Giter Site home page Giter Site logo

msoftware / jcropimageview Goto Github PK

View Code? Open in Web Editor NEW

This project forked from omgnuts/jcropimageview

0.0 2.0 0.0 96.79 MB

Provides a lightweight implementation to support top/left/right/bottom/center crop views of based on the imageview class.

Home Page: https://github.com/jimcoven/JCropImageView

License: Apache License 2.0

Java 100.00%

jcropimageview's Introduction

Overview of JCropImageView

Hex.pm Platform Android Arsenal

One of the popular scaletype configurations used in Android is the "centerCrop". However, it is limited to just center cropping. This usually crops off the faces of people from images that have an aspect ratio height > width.

Download the sample app

Get it on Google Play

JCropImageView is a lightweight extension of the centercrop feature to provide additional control over how the images are displayed. For example in the screenshot below:

  • JCropImageView is used on the top, and it shows IronMan's face.
  • ImageView (Android Default) with centerCrop is shown below, and only the body is shown.

alt text

In total, JCropImageView provides 11 configurations

  • FitWidth - 3 configurations - TOP/BOTTOM/CENTER
  • FitHeight - 3 configurations - CENTER/LEFT/RIGHT
  • FitBest - 5 configurations - TOP/BOTTOM/CENTER/LEFT/RIGHT depending on which scale is used.

Note: The configurations for FitWidth + LEFT/RIGHT are correct, but they doesn't show any visual difference. This is because when an image is fit to width, the full width is already within the visible left and right bounds. They are effectively ALWAYS aligned LEFT and RIGHT.

Similarly for FitHeight, it is effectively ALWAYS aligned TOP and BOTTOM

THe configurations are more visible with FitBest, which will decide which bound to fit to. The default android scaleType=centerCrop is effectively 1 of the above configurations FitBest + CENTER

alt text

How to use JCropImageView

A) Simply include the repository and dependency in your build.gradle file

repositories {
    mavenCentral()
}
dependencies {
    compile 'com.github.jimcoven:jcropimageview:0.22'
}

Just create an imageview as usual in xml. Then specify the configurations "app:cropType" and "app:cropAlign". If "app:cropType" is not specified, this reverts back to the default behaviour an Android ImageView.

Note! Remember to include the namespace xlmns:app

xmlns:app="http://schemas.android.com/apk/res-auto" 

<com.github.jimcoven.view.JCropImageView
    android:id="@+id/image_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:cropType="fit_width"
    app:cropAlign="top"
/>

Supported configurations are:

Supported configurations for "app:cropType" are:

  • fit_width : Stretch to fit width
  • fit_fill : Stretch to fit width or height to fill
  • fit_height: Stretch to fit height

Supported configurations for "app:cropAlign" are:

  • top : align top edge
  • bottom : align bottom edge
  • center : align center
  • left : align left edge
  • right : align right edge

jcropimageview's People

Watchers

Michael jentsch avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.