I would like to animate the color of a shape object to turn from one color to another color and then back again. I tried to set the color of my object with one method and then set it back to the original color with another method, but this seems rather cumbersome to me. Is there a better way to do this using C4?
You're right, the approach you're taking is cumbersome.
To animate forward and immediately back again, you can use the following line of code:
object.animationOptions: AUTOREVERSE;
object.fillColor = [UIColor ...];
To do this forever:
object.animationOptions: AUTOREVERSE | REPEAT;
object.fillColor = [UIColor ...];
... furthermore, you can use these animation options for ALL animated properties of any visible object in C4. So, you can autoreverse / repeat origin changes, center points, changing shapes, changing images, etc...
Related
I want to give TextButton a basic backgroundColor to distinguish it from a regular label.
Right now I am just drawing a filled rectangle behind the TextButton that I create with color (r,g,b,a) via a TextureRegion (in scala):
val pixmap = new Pixmap(1, 1, Pixmap.Format.RGBA8888)
pixmap.setColor(r, g, b, a)
pixmap.fillRectangle(0, 0, 1, 1)
val texture = new Texture(pixmap)
txr = new TextureRegion(texture)
pixmap.dispose
However, this means that every time I change the values of (r,g,b,a), a new texture is made, which is quite expensive. Therefore, I was wondering if there are better/easier ways to obtain a similar (visual) result.
Certainly!
A. textButton.setColor(color) or textButton.setColor(r,g,b,a) is probably the simplest way to get what you want - it tints the existing textbutton texture to the specified color
B. If you do want to create a specific texture in-code, you can color that as well by wrapping the TextureRegion in a TextureRegionDrawable, e.g. trd = new TextureRegionDrawable(new TextureRegion(new Texture(pixmap))), and then you can tint that using trd.tint(color) - that way you create the pixmap once, and can tint it differently for every TextButton
I need to create a time bar like the image attached.The blue lines are the dates indicating some actions.The big Red Arrow mark is used to slide for selecting any of the blue line. At background the bar is divided into years.The small red circles are to indicate the years.
Any idea ,how do i start?
Thanks
If the blue bars don't move a lot, and you don't need to resize this view very often (which is usually the case on an iPhone), then I'd recommend subclassing UIControl (or UIView) and implement it yourself.
Have an NSArray property storing NSDate objects and methods like addDate:, removeDate:, removeDateAtIndex: to change it's content from an other object (like your view controller). In these methods you add or remove the passed date and call [self setNeedsDisplay]; to redraw the lines.
You will need a few methods to calculate the position (in pixels) of a date on the slider and to calculate the date at a specific coordinate. This should be easy to to (basic linear interpolation).
And assuming that the red slider is only able to point to blue lines (but not between them) add a NSDate pointer variable to the currently selected date. In the
In the drawRect: method, you need to draw all the lines using CoreGraphics functions. Look up the documentation if you need help with this. Apple has some great sample apps too.
To show the red slider, you could either add a custom UIImageView, with a UIPanGestureRecognizer and make sure it only moves vertically in the gesture handler. Or it might be possible to add a UISlider without track images (I'm not 100% sure about that). In either case, you need to adjust the slider's position once the user let's go and make it jump to the nearest blue line.
A rough idea,
1. Get the length of the entire TimeBar.Let it be t.
2. Divide by x=numberofYears*365.let it be t_eachday_pos=t/x
3. get the position of each day,calculate its offset as daycount*t_eachday_pos;
4. Add your blueLine as a customButton.
5. To do some action, pass the x daynumber(eg. day 245 of year 2 etc.)
Try this, I have used the same thing in one of my app, and it is working
I subclass UISlider in order to make the thumb smaller, and I want to override minimumValueImageRectForBounds and maximumValueImageRectForBounds to make their width 2px less. So my code is
- (CGRect)minimumValueImageRectForBounds:(CGRect)bounds
{
CGRect stdRect = [super minimumValueImageRectForBounds:bounds];
return CGRectMake(stdRect.origin.x + 2, stdRect.origin.y, stdRect.size.width - 2, stdRect.size.height);
}
The point is that stdRect is empty rectangle (0, 0, 0, 0).
Morover, if I explicitly set some rectangle like that
- (CGRect)minimumValueImageRectForBounds:(CGRect)bounds
{
return CGRectMake(2, 0, 40, 8);
}
It doesn't affect minimum value image position at all.
Any ideas?
Haha, I just figured it out. I wasn't reading closely enough.
Setting the minimumValueImage is not the same as calling setMinimumTrackImage:forState:. The minimumValueImage is an image that gets displayed to the left of the slider and is independent what's going on in the slider. Overriding minimumValueImageRectForBounds changes the dimensions of this image (the default size being 0pt wide) and the sliders frame is made less wide and shifted to the right as a result. As I understand it, there isn't a way to modify the rectangle of the minimumTrackImage (such as to make it extend to the right of the thumb image); it is only possible to change the image.
I haven't really figured out the point of allowing you to set the minimumValueImage. It seems like you could accomplish the same thing by changing the size of the slider and adding separate UIImageViews to the side of the slider. Who knows.
Note that everything I've said here applies in the same way for the maximumValueImage and setMaximumTrackImage:forState methods.
DO NOT DO THIS. This is an old, incorrect answer, by past me. I hate that guy.
--
As a general rule, you probably don't want to subclass the Apple standard UI controls. You might want to build it up and set those properties yourself instead (not sure if they are settable, but seems like they should be).
I want to implement below chart like structure.
Explanation:
1. Each block should be clickable.
2. If the block is selected, it will be highlighted(i.e. Red block in figure).
I initially google for this but was unable to find. What should be "Drawing logic" corresponding to this with animation?Thanx in advance.
I think you need to use MCSegmentedControl.
You can get it from here.
Generally speaking, I'd have an image for the outline with a transparent middle, then dynamically create colored blocks behind it of the appropriate colors, with dynamic labels. The highlighting is a little tricky, but could be done with a set of image overlays. One could also try to shrink and expand fixed images for the bars/highlighting, but iPhone scales images poorly.
(Will it always be 4 blocks? There are a couple of other ways to manage it using fixed-size images overlaying each other.)
Maybe you should look into using CALayer for this?
U need to implement this type of logic using button. Just scale button width according to percentage.
And to make round rect button like appearance use the code below and don't forget to import quartz-core framework in class file.
And to scale first and last button as you need some overlap from nearby button.
btn.layer.cornerRadius = 8.0;
btn.layer.borderWidth = 0.5;
btn.layer.borderColor = [[UIColor blackColor] CGColor];
In viewDidLoad, I can create a gradient with no problem:
CAGradientLayer *blueGradient = [[CAGradientLayer layer] retain];
blueGradient.frame = CGRectMake(gradientStartX,gradientStartY,gradientWidth,gradientHeight);
where gradientWith is device-defined as 320 or 1024 as appropriate.
What I can’t do is resize it inside willRotateToInterfaceOrientation: -– and thus get rid of that empty black space off to the right -- after the user changes to landscape mode. (The nav bar and tab bar behave nicely.)
(1) Recalibrating the gradient’s new dimensions according to the new mid-point, (2) using kCALayerMaxXMargin, and (3) employing bounds all looked like they would do the job. bounds looked a litte more intuitive, so I tried that.
I don’t want to admit that I have made zero progress.
I will say that I’ve been reduced to the brute force method of trying every permutation of self, view, layer, bounds, blueGradient, and CGRect(gradientStartX,gradientStartY,newGradientWidth,newGradientHeight) with zero success.
This is not difficult. My lack of understanding is making it difficult. Anyone out there “Been there, done that”?
Does the layer resize its size automatically? If so, simple
[blueGradient setNeedsDisplay];
should do the trick.
Hope this was helpful,
Paul