Skip to content

Commit

Permalink
Merge pull request #1 from zenput/android-gallery_ui_MOBILE-449
Browse files Browse the repository at this point in the history 
Android and iOS Gallery ui mobile 449
  • Loading branch information
@davidofwatkins
davidofwatkins authored Aug 14, 2017
2 parents f6e291b + 89bbf44 commit 21d1017
Show file tree
Hide file tree
Showing 3 changed files with 137 additions and 62 deletions.
1 change: 1 addition & 0 deletions plugin.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
id="cordova-plugin-image-picker"
version="1.1.1">

<dependency id="cordova-plugin-donkeyfont" url="https://github.com/zenput/cordova-plugin-donkeyfont" commit="v1.0" />
<name>ImagePicker</name>

<description>
Expand Down
84 changes: 52 additions & 32 deletions src/android/Library/src/MultiImageChooserActivity.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,8 @@
import java.util.Map.Entry;
import java.util.Set;

import com.synconset.FakeR;
import com.zenput.mobile.R;

import android.app.Activity;
import android.app.ActionBar;
import android.app.AlertDialog;
Expand All @@ -53,11 +54,15 @@
import android.content.DialogInterface;
import android.content.Intent;
import android.content.Loader;
import android.content.pm.ActivityInfo;
import android.database.Cursor;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Typeface;
import android.net.Uri;
import android.os.AsyncTask;
import android.os.Bundle;
Expand Down Expand Up @@ -87,6 +92,8 @@ public class MultiImageChooserActivity extends Activity implements OnItemClickLi
public static final String HEIGHT_KEY = "HEIGHT";
public static final String QUALITY_KEY = "QUALITY";

private Typeface mDonkeyFont = null;

private ImageAdapter ia;

private Cursor imagecursor, actualimagecursor;
Expand All @@ -96,9 +103,9 @@ public class MultiImageChooserActivity extends Activity implements OnItemClickLi
private static final int CURSORLOADER_THUMBS = 0;
private static final int CURSORLOADER_REAL = 1;

private Map<String, Integer> fileNames = new HashMap<String, Integer>();
public Map<String, Integer> fileNames = new HashMap<String, Integer>();

private SparseBooleanArray checkStatus = new SparseBooleanArray();
public SparseBooleanArray checkStatus = new SparseBooleanArray();

private int maxImages;
private int maxImageCount;
Expand All @@ -121,10 +128,14 @@ public class MultiImageChooserActivity extends Activity implements OnItemClickLi
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
fakeR = new FakeR(this);
setContentView(fakeR.getId("layout", "multiselectorgrid"));
checkStatus.clear();
fileNames.clear();

mDonkeyFont = Typeface.createFromAsset(getAssets(), "fonts/donkeyfont.ttf");

maxImages = getIntent().getIntExtra(MAX_IMAGES_KEY, NOLIMIT);
desiredWidth = getIntent().getIntExtra(WIDTH_KEY, 0);
desiredHeight = getIntent().getIntExtra(HEIGHT_KEY, 0);
Expand Down Expand Up @@ -186,6 +197,7 @@ public void onItemClick(AdapterView<?> arg0, View view, int position, long id) {
return;
}
boolean isChecked = !isChecked(position);
((SquareImageView)view).checked = isChecked;
if (maxImages == 0 && isChecked) {
isChecked = false;
AlertDialog.Builder builder = new AlertDialog.Builder(this);
Expand All @@ -204,28 +216,16 @@ public void onClick(DialogInterface dialog, int which) {
this.selectClicked(null);
} else {
maxImages--;
ImageView imageView = (ImageView)view;
if (android.os.Build.VERSION.SDK_INT>=16) {
imageView.setImageAlpha(128);
} else {
imageView.setAlpha(128);
}
view.setBackgroundColor(selectedColor);
}
} else {
fileNames.remove(name);
maxImages++;
ImageView imageView = (ImageView)view;
if (android.os.Build.VERSION.SDK_INT>=16) {
imageView.setImageAlpha(255);
} else {
imageView.setAlpha(255);
}
view.setBackgroundColor(Color.TRANSPARENT);
}

checkStatus.put(position, isChecked);
updateAcceptButton();
//this forces a call to onDraw()
view.invalidate();
}

@Override
Expand Down Expand Up @@ -393,6 +393,8 @@ public boolean isChecked(int position) {
* Nested Classes
********************/
private class SquareImageView extends ImageView {

public boolean checked = false;
public SquareImageView(Context context) {
super(context);
}
Expand All @@ -401,6 +403,35 @@ public SquareImageView(Context context) {
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, widthMeasureSpec);
}

@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);

Paint iconPaint = new Paint();
iconPaint.setTypeface(mDonkeyFont);
float size = this.getWidth() * 0.25f;
float padding = this.getWidth() * 0.05f;
iconPaint.setTextSize(size);

if (this.checked) {
int zenputBlue = getResources().getColor(R.color.zenputBlue);
iconPaint.setColor(zenputBlue);
iconPaint.setAlpha(255);
Paint circlePaint = new Paint();
circlePaint.setTypeface(mDonkeyFont);
circlePaint.setColor(Color.WHITE);
circlePaint.setTextSize(size);


canvas.drawText(getString(R.string.icon_zp_v2_circle), padding, padding + size, circlePaint);
canvas.drawText(getString(R.string.icon_zp_v2_gallery_image_selected), padding, padding+size, iconPaint);
} else {
iconPaint.setColor(Color.WHITE);
iconPaint.setAlpha(255);
canvas.drawText(getString(R.string.icon_zp_v2_gallery_image_unselected), padding, padding+size, iconPaint);
}
}
}


Expand Down Expand Up @@ -444,6 +475,9 @@ public View getView(int pos, View convertView, ViewGroup parent) {
ImageView imageView = (ImageView)convertView;
imageView.setImageBitmap(null);

SquareImageView squareImageView = (SquareImageView)imageView;
squareImageView.checked = checkStatus.get(pos);

final int position = pos;

if (!imagecursor.moveToPosition(position)) {
Expand All @@ -456,21 +490,7 @@ public View getView(int pos, View convertView, ViewGroup parent) {

final int id = imagecursor.getInt(image_column_index);
final int rotate = imagecursor.getInt(image_column_orientation);
if (isChecked(pos)) {
if (android.os.Build.VERSION.SDK_INT>=16) {
imageView.setImageAlpha(128);
} else {
imageView.setAlpha(128);
}
imageView.setBackgroundColor(selectedColor);
} else {
if (android.os.Build.VERSION.SDK_INT>=16) {
imageView.setImageAlpha(255);
} else {
imageView.setAlpha(255);
}
imageView.setBackgroundColor(Color.TRANSPARENT);
}

if (shouldRequestThumb) {
fetcher.fetch(Integer.valueOf(id), imageView, colWidth, rotate);
}
Expand Down
114 changes: 84 additions & 30 deletions src/ios/ELCImagePicker/ELCAssetCell.m
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,24 @@

#import "ELCAssetCell.h"
#import "ELCAsset.h"
#import "Donkeyfont.h"

@interface ELCAssetCell ()

@property (nonatomic, strong) NSArray *rowAssets;
@property (nonatomic, strong) NSMutableArray *imageViewArray;
@property (nonatomic, strong) NSMutableArray *overlayViewArray;
@property (nonatomic, strong) NSMutableArray *checkIconArray;
@property (nonatomic, strong) NSMutableArray *circleIconArray;

@end

static const float gThumbWidth = 75.0f;
static const float gThumbHeight = 75.0f;
static const float gTopBuffer = 2.0f;
static const float gIconLeftBuffer = 5.0f;
static const float gIconTopBuffer = 5.0f;
static const unsigned int gRowMax = 4;

@implementation ELCAssetCell

//Using auto synthesizers
Expand All @@ -27,11 +36,14 @@ - (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reus
UITapGestureRecognizer *tapRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(cellTapped:)];
[self addGestureRecognizer:tapRecognizer];

NSMutableArray *mutableArray = [[NSMutableArray alloc] initWithCapacity:4];
NSMutableArray *mutableArray = [[NSMutableArray alloc] initWithCapacity:gRowMax];
self.imageViewArray = mutableArray;

NSMutableArray *overlayArray = [[NSMutableArray alloc] initWithCapacity:4];
self.overlayViewArray = overlayArray;
NSMutableArray *checkIconArray = [[NSMutableArray alloc] initWithCapacity:gRowMax];
self.checkIconArray = checkIconArray;

NSMutableArray *circleIconArray = [[NSMutableArray alloc] initWithCapacity:gRowMax];
self.circleIconArray = circleIconArray;
}
return self;
}
Expand All @@ -42,76 +54,118 @@ - (void)setAssets:(NSArray *)assets
for (UIImageView *view in _imageViewArray) {
[view removeFromSuperview];
}
for (UIImageView *view in _overlayViewArray) {

for (UILabel *view in _checkIconArray) {
[view removeFromSuperview];
}
//set up a pointer here so we don't keep calling [UIImage imageNamed:] if creating overlays
UIImage *overlayImage = nil;
}

for (UILabel *view in _circleIconArray) {
[view removeFromSuperview];
}

UIFont *donkeyFont = [UIFont fontWithName:@"DonkeyFont" size:25];
UILabel *checkLabel = nil;
UILabel *circleLabel = nil;
CGSize overlaySize;
for (int i = 0; i < [_rowAssets count]; ++i) {

ELCAsset *asset = [_rowAssets objectAtIndex:i];

if (i < [_imageViewArray count]) {
UIImageView *imageView = [_imageViewArray objectAtIndex:i];
imageView.image = [UIImage imageWithCGImage:asset.asset.thumbnail];
overlaySize = CGSizeMake(CGRectGetWidth(imageView.frame), CGRectGetHeight(imageView.frame));
} else {
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageWithCGImage:asset.asset.thumbnail]];
[_imageViewArray addObject:imageView];
overlaySize = CGSizeMake(CGRectGetWidth(imageView.frame), CGRectGetHeight(imageView.frame));
}

if (i < [_overlayViewArray count]) {
UIImageView *overlayView = [_overlayViewArray objectAtIndex:i];
overlayView.hidden = asset.selected ? NO : YES;

if (i < [_checkIconArray count]) {
UILabel *circleLabel = [_circleIconArray objectAtIndex:i];
UILabel *checkLabel = [_checkIconArray objectAtIndex:i];
[self selectThumbnail:checkLabel circleLabel:circleLabel selected:asset.selected];
} else {
if (overlayImage == nil) {
overlayImage = [UIImage imageNamed:@"Overlay.png"];
}
UIImageView *overlayView = [[UIImageView alloc] initWithImage:overlayImage];
[_overlayViewArray addObject:overlayView];
overlayView.hidden = asset.selected ? NO : YES;
checkLabel = [[UILabel alloc] init];
checkLabel.textColor = [UIColor whiteColor];
checkLabel.font = donkeyFont;
checkLabel.textAlignment = NSTextAlignmentLeft;
[_checkIconArray addObject:checkLabel];

circleLabel = [[UILabel alloc] init];
circleLabel.textColor = [UIColor whiteColor];
circleLabel.font = donkeyFont;
circleLabel.textAlignment = NSTextAlignmentLeft;
[_circleIconArray addObject:circleLabel];

[self selectThumbnail:checkLabel circleLabel:circleLabel selected:asset.selected];
}
}
}

- (void)cellTapped:(UITapGestureRecognizer *)tapRecognizer
{
CGPoint point = [tapRecognizer locationInView:self];
CGFloat totalWidth = self.rowAssets.count * 75 + (self.rowAssets.count - 1) * 4;
CGFloat totalWidth = self.rowAssets.count * gThumbWidth + (self.rowAssets.count - 1) * gRowMax;
CGFloat startX = (self.bounds.size.width - totalWidth) / 2;

CGRect frame = CGRectMake(startX, 2, 75, 75);
CGRect frame = CGRectMake(startX, gTopBuffer, gThumbWidth, gThumbHeight);

for (int i = 0; i < [_rowAssets count]; ++i) {
for (int i = 0; i < [_rowAssets count]; ++i) {

if (CGRectContainsPoint(frame, point)) {
ELCAsset *asset = [_rowAssets objectAtIndex:i];
asset.selected = !asset.selected;
UIImageView *overlayView = [_overlayViewArray objectAtIndex:i];
overlayView.hidden = !asset.selected;
UILabel *checkLabel = [_checkIconArray objectAtIndex:i];
UILabel *circleLabel = [_circleIconArray objectAtIndex:i];
[self selectThumbnail:checkLabel circleLabel:circleLabel selected:asset.selected];
break;
}
frame.origin.x = frame.origin.x + frame.size.width + 4;
frame.origin.x = frame.origin.x + frame.size.width + gRowMax;
}
}

- (void)layoutSubviews
{
CGFloat totalWidth = self.rowAssets.count * 75 + (self.rowAssets.count - 1) * 4;
CGFloat totalWidth = self.rowAssets.count * gThumbWidth + (self.rowAssets.count - 1) * gRowMax;
CGFloat startX = (self.bounds.size.width - totalWidth) / 2;

CGRect frame = CGRectMake(startX, 2, 75, 75);
CGRect frame = CGRectMake(startX, gTopBuffer, gThumbWidth, gThumbHeight);

for (int i = 0; i < [_rowAssets count]; ++i) {
UIImageView *imageView = [_imageViewArray objectAtIndex:i];
[imageView setFrame:frame];
[self addSubview:imageView];

UIImageView *overlayView = [_overlayViewArray objectAtIndex:i];
[overlayView setFrame:frame];
[self addSubview:overlayView];
UILabel *checkLabel = [_checkIconArray objectAtIndex:i];
UILabel *circleLabel = [_circleIconArray objectAtIndex:i];
CGRect iconFrame = CGRectMake(frame.origin.x + gIconLeftBuffer,
frame.origin.y + gIconTopBuffer,
frame.size.width,
frame.size.height / 3);
[checkLabel setFrame:iconFrame];
[circleLabel setFrame:iconFrame];
[self addSubview:circleLabel];

[self addSubview:checkLabel];



frame.origin.x = frame.origin.x + frame.size.width + 4;
frame.origin.x = frame.origin.x + frame.size.width + gRowMax;
}
}

- (void)selectThumbnail:(UILabel*)checkLabel circleLabel:(UILabel*)circleLabel selected:(bool)selected {
checkLabel.text = selected ? ICON_ZP_V2_GALLERY_IMAGE_SELECTED : ICON_ZP_V2_GALLERY_IMAGE_UNSELECTED;
checkLabel.textColor = selected ? [UIColor colorWithRed:22.0f / 255.0f
green:157 / 255.0f
blue:217.0f / 255.0f
alpha:1.0] : [UIColor whiteColor];

circleLabel.text = ICON_ZP_V2_CIRCLE;
circleLabel.textColor = [UIColor whiteColor];
circleLabel.alpha = selected ? 1.0f : 0.0f;
}


@end

0 comments on commit 21d1017

Please sign in to comment.