Does anyone know how to show a rounded squared with a spinning activity indicator? It is used in many apps. If you don't know what im talking about, it looks like the indicator when you change volume on your Mac but with a darker background. Im not sure if it is built-in to iOS or someone made it.
Like the one in this post but not full screen just the activity indicator
How to create a full-screen modal status display on iPhone?
Here's what I use when I want to show that kind of indicators.
UIView *loading = [[UIView alloc] initWithFrame:CGRectMake(100, 200, 120, 120)];
loading.layer.cornerRadius = 15;
loading.opaque = NO;
loading.backgroundColor = [UIColor colorWithWhite:0.0f alpha:0.6f];
UILabel *loadLabel = [[UILabel alloc] initWithFrame:CGRectMake(20, 25, 81, 22)];
loadLabel.text = #"Loading";
loadLabel.font = [UIFont boldSystemFontOfSize:18.0f];
loadLabel.textAlignment = UITextAlignmentCenter;
loadLabel.textColor = [UIColor colorWithWhite:1.0f alpha:1.0f];
loadLabel.backgroundColor = [UIColor clearColor];
[loading addSubview:loadLabel];
[loadLabel release];
UIActivityIndicatorView *spinning = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];
spinning.frame = CGRectMake(42, 54, 37, 37);
[spinning startAnimating];
[loading addSubview:spinning];
[spinning release];
loading.frame = CGRectMake(100, 200, 120, 120);
Then you just add the 'loading' view to the view of your choice and you got it.
Hope this is what you needed.
Your screenshot is probably a usage of David Sinclair's DSActivityView module. Specifically, the DSBezelActivityView component of it. Or if not, it's a close copy.
http://www.dejal.com/developer/dsactivityview
I use DSActivityView all the time. Great library. Toss that thing up while pulling down data, keeps users and clients happy.
One option: MBProgressHUD.
I don't think that screenshot is my DSBezelActivityView; the metrics look a little different. But it is very similar.
Note, DSActivityView and its subclasses don't use any images or nibs; they're pure code.
To answer the original question, it'd be easy to modify DSBezelActivityView to omit the fullscreen gray background. You could do it by subclassing and overriding the -setupBackground method thusly:
- (void)setupBackground;
{
[super setupBackground];
self.backgroundColor = [UIColor clearColor];
}
Hope this helps!
Try this simple method, Its working well for me....
UIActivityIndicatorView *activityIndicator= [[UIActivityIndicatorView alloc]initWithFrame:CGRectMake(0, 0, 50, 50)];
activityIndicator.layer.cornerRadius = 05;
activityIndicator.opaque = NO;
activityIndicator.backgroundColor = [UIColor colorWithWhite:0.0f alpha:0.6f];
activityIndicator.center = self.view.center;
activityIndicator.activityIndicatorViewStyle = UIActivityIndicatorViewStyleGray;
[activityIndicator setColor:[UIColor colorWithRed:0.6 green:0.8 blue:1.0 alpha:1.0]];
[self.view addSubview: activityIndicator];
You're actually looking at using two UIView subclasses and a custom .png image to get the look you want.
The Gray translucent box would be a UIImageView object, to get the effect you're looking for you need a .png file of a grey square with rounded corners, it doesn't need to be the final size, as long as there's at least one pixel of straight edge between the corners it will work fine. You'll then load it in as a UIImage with the UIImage
stretchableImageWithLeftCapWidth:topCapHeight: method, this let's you specify the top, and left portions of the image that must stay the same, and a 1 pixel slice in each direction will be stretched out to fill the UIImage view you use the image in. http://www.bit-101.com/blog/?p=2275 has a great example of how this works.
So create a UIImage, then create a UIImageView using this image, set its opaque property to NO and the alpha property to something that looks good to you. Add this a subview of your current view.
Now you just need to add the spinning progress indicator, this is even easier, just create a new UIActivityIndicatorView and add it as a subview of the UIImageView you've already created.
The same basic method is used to create pretty much any resizable element in an iOS application. There's some examples of using them for buttons in Apple's UICatalog example code.
Related
I am creating 1000 views in a scrollview. This takes more time to load the view.
wordsDetails *wordsObj;
for(int i = 0; i<arrayOfWords.count;i++) {
UIView *viewForDisplay = [[UIView alloc]initWithFrame:CGRectMake(320*i, 0, 320, 440)];
UILabel *wordLabel = [[UILabel alloc]initWithFrame:CGRectMake(30, 40, 240, 40)];
wordLabel.backgroundColor = [UIColor clearColor];
wordLabel.textColor = [UIColor yellowColor];
wordLabel.font = [UIFont fontWithName:#"Didot" size:24.0];
wordsObj = [arrayOfWords objectAtIndex:i];
wordLabel.text = wordsObj.word;//[NSString stringWithFormat:#"sdssds - %i",i];
[viewForDisplay addSubview:wordLabel];
UITextView *textView = [[UITextView alloc]initWithFrame:CGRectMake(30, 100, 240, 100)];
textView.text = wordsObj.meaning;
textView.editable = NO;
textView.textColor = [UIColor whiteColor];
textView.font = [UIFont fontWithName:#"Didot" size:20.0];
textView.backgroundColor = [UIColor clearColor];
[viewForDisplay addSubview:textView];
[fScrollView addSubview:viewForDisplay];
}
Is there a way to call this in thread.
Don't do it like this. Use a cell-based scrollview subclass (table view or collection view) or roll your own. Your content is the width of the screen so there is absolutely no need to load 1000 screens worth of content at once.
With the cell-based views you only create as many as are needed to show a screen, and these are recycled and reconfigured as new content comes on screen.
I am creating 1000 views in a scrollview.
Don't do that. The user can't possibly use 1000 views all at once, so don't create them all at once. There are some good videos from WWDC 2010, 2011, and 2012 that cover tiling the content in scroll views -- take a look at those for some great ideas.
The scroll view delegate gets messages as the scroll view's content moves, and you can use those messages to add content just in time for it to scroll onto the screen and remove it after it has scrolled off. This is essentially what UITableView and UICollectionView do, and you can use either of them as jrturton suggests, or you can follow the same pattern yourself.
This will not only speed up the creation of your scroll view, it'll also make your scrolling smoother and consume much less memory than you would need otherwise.
I have a problem .. I used this http://kwigbo.com/post/318396305/iphone-sdk-custom-uialertview-background-color to create my own custom UIAlertView.
I do not know why but this will not work:
UILabel *theTitle = [theAlert valueForKey:#"_titleLabel"];
[theTitle setTextColor:[UIColor redColor]];
UILabel *theBody = [theAlert valueForKey:#"_bodyTextLabel"];
[theBody setTextColor:[UIColor blueColor]];
the color of the title does not change .. the color of texbody it's ok.
How can I customize the buttons?
Hi Achieved same thing using custom UIAleartView.
Make a custom view as follows.
UIView *tempView = [[UIView alloc] initWithFrame:CGRectMake(0.0f, 5.0f, 262.0, 49)];
tempView.backgroundColor = [UIColor clearColor];
UILabel *lblTitle = [[UILabel alloc] initWithFrame:CGRectMake(12, 0, 262.0, 49)];
lblTitle.font = [UIFont fontWithName:#"Arial" size:22.0f];
lblTitle.textColor = [UIColor whiteColor];
lblTitle.textAlignment = UITextAlignmentCenter;
lblTitle.text = #"Subscribe";
lblTitle.backgroundColor = [UIColor clearColor];
[tempView addSubview:lblTitle];
alreadySubscriber = [[UIButton alloc] initWithFrame:CGRectMake(12, 260, 262.0, 50)];
alreadySubscriber.layer.cornerRadius = 25.0f;
[alreadySubscriber setTitle:#"Already a subscriber" forState:UIControlStateNormal];
[alreadySubscriber setBackgroundImage:[UIImage imageNamed:#"BTN0.png"] forState:UIControlStateNormal];
[alreadySubscriber setBackgroundImage:[UIImage imageNamed:#"BTN1.png"] forState:UIControlStateSelected];
[tempView addSubview:alreadySubscriber];
Insert this in UIAleartView
[self insertSubview:tempView atIndex:0];
[self setNeedsLayout];
Override layoutsubview as you have already done push all other controls down equal to view Height.
-> basically matter is to hide UIAleartView's title behind a label.
Not sure exactly what your issue might be, but we faced a similar situation when trying to workout a custom UIAlertView, so might be similar.
The custom solution in the link you provided appears to manipulate the alerts title and background by accessing the subview hierarchy and 'guessing' which subview might be which. (I may be wrong, didn't look through it in detail) The problem with this approach is that it'll work fine for one OS version, but in subsequent OS versions, Apple may restructure this subview hierarchy in some manner, and this 'guesswork' is no longer accurate. (i.e. the subview assumed to be the background image may not be).
This could be the case, seeing that posted link is an year old. If you're proceeding with this, you may have to review the subview hierarchy to see if they still match up.
I believe, that you can find proper solution without using standart tools, which are present in UIAlertView. But in this case, you application will be not approve for AppStore. That way, I strongly recommend you, avoid to using custom buttons in AlertView.
Maybe, you will find solution using UIActionSheet instead UIAlertView . It's more customizing.
If #"_titleLabel" is part of the UIAlertView hierarchy (which looks likely given the _ prefix), I can't recommend your approach.
Apple might some day change the key strings: If #"_titleLabel" ever changes, say to #"_titleLabelView", you're sunk and you might never know that you're sunk. This might even be grounds for rejection, I wouldn't know.
It's better to start out from scratch with your own custom view, subclassing UIView. Only then can you guarantee that this will be stable from OS to OS. On top of this, the time you lose trying to find a shortcut will be positively spent constructing some thing durable.
Hello I'd like to achieve at the same time rounded corners and a background composed by tiling a little png (OPERATOR_VIEW_BACKGROUND_IMAGE). My main goal is to allow a designer to fill the background of a View by inserting the right image in the project resources.
[triggerView setFrame:CGRectMake(0, 0, ICONS_WIDTH, iconFrameHeight)];
[triggerView.layer setCornerRadius:borderRadius];
[triggerView setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:OPERATOR_VIEW_BACKGROUND_IMAGE]]];;
I don't know why but triggerView loose the CornerRadius setting when I add the last line.
triggerView is a UIView built with interface builder and modified in its superView viewDidLoad programmatically, with the code above.
Where I'm wrong?
EDIT: I haven't mentioned that If I use a simple UIColor like: [UIColor orangeColor] It works well. So It's something related to the patternImage thing.
EDIT: I've tried also this code, working on the layer background of my view:
[triggerView setFrame:CGRectMake(0, 0, ICONS_WIDTH, iconFrameHeight)];
triggerView.backgroundColor = [UIColor clearColor];
UIImage *img = [UIImage imageNamed:OPERATOR_VIEW_BACKGROUND_IMAGE];
triggerView.layer.backgroundColor = [UIColor colorWithPatternImage:img].CGColor;
triggerView.layer.cornerRadius = radius;
[img release];
[self.view addSubview:triggerView];
Now I get a transparent background but the corners are rounded;
OK, thanks to Ben's comment and this Blog entry I've found this solution:
[triggerView setFrame:CGRectMake(0, 0, ICONS_WIDTH, iconFrameHeight)];
triggerView.layer.masksToBounds = YES;
triggerView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:OPERATOR_VIEW_BACKGROUND_IMAGE]];
triggerView.layer.cornerRadius = radius;
[self.view addSubview:triggerView];
Seems that triggerView.layer.masksToBounds = YES; was the missing piece, but I still don't understand why triggerView.layer.cornerRadius = radius; alone didn't suffice.
Try setting the content property of the layer with the CGImageRef of the image:
triggerView.layer.contents = (id) [[UIImage imageNamed:OPERATOR_VIEW_BACKGROUND_IMAGE] CGImage];
You may have to alloc or retain the UIImage to prevent it being autoreleased...
With iOS SDK 4.0 and 4.1, colorWithPatternImage method has got a bug that show badly an image...
I used this method and I had this bug but I could resolve using another method...
Try to use the initWithPatternImage method of UIColor class:
UIColor *imageBg = [[UIColor alloc] initWithPatternImage:[UIImage imageNamed:OPERATOR_VIEW_BACKGROUND_IMAGE]];
This worked greatly for me...
Unfortunately I never used cornerRadius method and I don't know a possibly solution for this other problem.
Can we add activity indicator as subview to UIButton?
If yes then plz tell me how to do that?
I used [button addSubview:activityIndicator];
Not working...
I found that adding a UIActivityIndicatorView to a UIButton was a really useful method to allow users to know something is happening without having to use the MBProgressHUD (I think the HUD is really good but should not be used in all situations.
For this reason I created two functions:
I have already allocated my UIButton so it is a class variable called _confirmChangesButton
I then create my activity indicator, set its frame (taking into account the button size) and then adding the indicator is easy.
- (void)addActivityIndicatorToConfirmButton {
// Indicator needs to be in the middle of the button. So half the screen less half the buttons left inset less half the activity indicator size
CGRect rect = CGRectMake([UIScreen mainScreen].bounds.size.width/2 - 10 - 15, 5, 30, 30);
UIActivityIndicatorView * activity = [[UIActivityIndicatorView alloc] initWithFrame:rect];
activity.hidesWhenStopped = YES;
[_confirmChangesButton setTitle:#"" forState:UIControlStateNormal];
[_confirmChangesButton addSubview:activity];
[activity startAnimating];
}
Having a removal function is also useful if you are using blocks. It might be that the completion task comes back with a failure and so we want to remove the indicator and change the title back. In this function we need to make sure to remove the indicator and not the button label which is the other subview on this button.
- (void)removeActivityIndicatorFromConfirmButton {
UIActivityIndicatorView * activity = _confirmChangesButton.subviews.lastObject;;
[activity removeFromSuperview];
[_confirmChangesButton setTitle:#"Confirm Change" forState:UIControlStateNormal];
}
I found that using these two you can create a much better user experience letting the user know what is going on when they press buttons.
Hope this helps
Use the below code below to add acitivity indicator a button or any uiview object
UIActivityIndicatorView *aView = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhite];
aView.frame = CGRectMake(0, 0, {yourButton}.frame.size.width, {yourButton}.frame.size.height);
aView.backgroundColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.7];
[{yourButton} addSubview:aView];
[aView startAnimating];
Hope this will help..
I don't think it's possible to add a view to a button. UIButton have this method because it's inherited from UIVIew.
The real question is : why do you want to add an activity indicator on a button and not elsewhere ?
did you do [activityIndicator startAnimating]; ALso as u are using it in a tableview just check if the tags are set properly
When you try deleting a note in iPhone's Notes application, an UIActionSheet pops up. The sheet is translucent (but not black translucent). How is that achieved? Is it possible to make the background of UIActionSheet a certain color?
I usually implement the following delegate method:
- (void)willPresentActionSheet:(UIActionSheet *)actionSheet
Just to make a sample. In this case I use a stretched png as a background:
- (void)willPresentActionSheet:(UIActionSheet *)actionSheet {
UIImage *theImage = [UIImage imageNamed:#"detail_menu_bg.png"];
theImage = [theImage stretchableImageWithLeftCapWidth:32 topCapHeight:32];
CGSize theSize = actionSheet.frame.size;
// draw the background image and replace layer content
UIGraphicsBeginImageContext(theSize);
[theImage drawInRect:CGRectMake(0, 0, theSize.width, theSize.height)];
theImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
[[actionSheet layer] setContents:(id)theImage.CGImage];
}
and this is the result:
alt text http://grab.by/4yF1
You can use the code below:
actionSheetObj.actionSheetStyle=UIActionSheetStyleBlackOpaque;
or
actionSheetObj.actionSheetStyle=UIActionSheetStyleBlackTranslucent;
actionSheetObj.actionSheetStyle=UIActionSheetStyleBlackTranslucent;
It's not too difficult. You can use the following code:
CGSize mySize = myActionSheet.bounds.size;
CGRect myRect = CGRectMake(0, 0, mySize.width, mySize.height);
UIImageView *redView = [[[UIImageView alloc] initWithFrame:myRect] autorelease];
[redView setBackgroundColor:[UIColor colorWithRed:1.0 green:0.0 blue:0.0 alpha:0.5]];
[myActionSheet insertSubview:redView atIndex:0];
Just make sure you present the UIActionSheet before doing this or the size wont be set. That makes it kind of ugly, but you could do something like:
[myActionSheet showInView:self.view];
if (!redAdded) {
redAdded = YES;
//THE ABOVE CODE GOES HERE
}
You can definitely adjust the opacity by setting the alpha value. Interface Builder lets you edit the value directly, but in code I think you would do:
[[myActionSheet view] setOpaque:NO];
[[myActionSheet view] setAlpha:0.5];
I'm not sure if you need the setOpaque call or not - I think that is used to help optimize performance, as the iPhone won't try to render anything hidden by the opaque view.
It looks black to me (note: using 2.2.1). The only reason there's a color to it is because of the yellow behind it.
One option would be to use the black transparent background and find out the size and speed of the action sheet. Then create a view and animate it in at the same time you show the action sheet, just underneath it, to give it a tint different than the color naturally behind the action sheet. You would have to make the color view also translucent so you could see behind that as well.
I'm not sure if you can, but you might also try adjusting the opacity of the action sheet itself as well.