Градиенты на UIView и UILabels на iPhone
Возможный дубликат:
Вручную рисовать градиент в приложениях iPhone?
Мое приложение должно отображать текст либо в UIView
, либо UILabel
, но на заднем плане должен быть градиент, а не истинный UIColor
. Использование графической программы для создания желаемого внешнего вида не подходит, так как текст может меняться в зависимости от данных, возвращаемых с сервера.
Кто-нибудь знает самый быстрый способ справиться с этим?
Ваши мысли приветствуются.
Ответы
Ответ 1
Вы также можете использовать графическое изображение шириной в один пиксель в качестве градиента и установить свойство вида для расширения графика, чтобы заполнить представление (предполагая, что вы думаете о простом линейном градиенте, а не о какой-то радиальной графике).
Ответ 2
Я понимаю, что это более старый поток, но для справок в будущем:
Как и iPhone SDK 3.0, пользовательские градиенты могут быть реализованы очень легко, без подкласса или изображений, используя новый CAGradientLayer
:
UIView *view = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 100)] autorelease];
CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = view.bounds;
gradient.colors = [NSArray arrayWithObjects:(id)[[UIColor blackColor] CGColor], (id)[[UIColor whiteColor] CGColor], nil];
[view.layer insertSublayer:gradient atIndex:0];
Взгляните на документы CAGradientLayer. Вы можете опционально указать начальную и конечную точки (если вам не нужен линейный градиент, идущий прямо сверху вниз) или даже конкретные местоположения, которые соответствуют каждому из цветов.
Ответ 3
Вы можете использовать Core Graphics для рисования градиента, как указано в ответе Майка. В качестве более подробного примера вы можете создать подкласс UIView
для использования в качестве фона для вашего UILabel
. В этом подклассе UIView
переопределите метод drawRect:
и введите код, похожий на следующий:
- (void)drawRect:(CGRect)rect
{
CGContextRef currentContext = UIGraphicsGetCurrentContext();
CGGradientRef glossGradient;
CGColorSpaceRef rgbColorspace;
size_t num_locations = 2;
CGFloat locations[2] = { 0.0, 1.0 };
CGFloat components[8] = { 1.0, 1.0, 1.0, 0.35, // Start color
1.0, 1.0, 1.0, 0.06 }; // End color
rgbColorspace = CGColorSpaceCreateDeviceRGB();
glossGradient = CGGradientCreateWithColorComponents(rgbColorspace, components, locations, num_locations);
CGRect currentBounds = self.bounds;
CGPoint topCenter = CGPointMake(CGRectGetMidX(currentBounds), 0.0f);
CGPoint midCenter = CGPointMake(CGRectGetMidX(currentBounds), CGRectGetMidY(currentBounds));
CGContextDrawLinearGradient(currentContext, glossGradient, topCenter, midCenter, 0);
CGGradientRelease(glossGradient);
CGColorSpaceRelease(rgbColorspace);
}
В этом конкретном примере создается белый градиент с глянцевым стилем, который рисуется с вершины UIView
до его вертикального центра. Вы можете установить UIView
backgroundColor
как угодно, и этот блеск будет нарисован поверх этого цвета. Вы также можете нарисовать радиальный градиент с помощью функции CGContextDrawRadialGradient
.
Вам просто нужно соответствующим образом изменить размер UIView
и добавить UILabel
в качестве подзадачи для получения желаемого эффекта.
EDIT (4/23/2009): Per St3fan предложение, я заменил рамку представления своими границами в коде. Это исправляется для случая, когда начало координат не равно (0,0).
Ответ 4
При использовании CAGradientLayer
, в отличие от CGGradient
, градиент не является гладким, но имеет заметный шаг к нему. См.
:
Чтобы получить более привлекательные результаты, лучше использовать CGGradient
.
Ответ 5
Ответ Mirko Froehlich работал у меня, если только я не хотел использовать пользовательские цвета. Хитрость заключается в том, чтобы указать цвет пользовательского интерфейса с оттенком, насыщенностью и яркостью вместо RGB.
CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = myView.bounds;
UIColor *startColour = [UIColor colorWithHue:.580555 saturation:0.31 brightness:0.90 alpha:1.0];
UIColor *endColour = [UIColor colorWithHue:.58333 saturation:0.50 brightness:0.62 alpha:1.0];
gradient.colors = [NSArray arrayWithObjects:(id)[startColour CGColor], (id)[endColour CGColor], nil];
[myView.layer insertSublayer:gradient atIndex:0];
Чтобы получить оттенок, насыщенность и яркость цвета, используйте встроенный блок выбора цвета xcode и перейдите на вкладку HSB. Оттенок измеряется в градусах в этом представлении, поэтому разделите значение на 360, чтобы получить значение, которое вы хотите ввести в код.
Ответ 6
Это то, что я получил, установил UIButton в xCode IB прозрачным/прозрачным и без изображения bg.
UIColor *pinkDarkOp = [UIColor colorWithRed:0.9f green:0.53f blue:0.69f alpha:1.0];
UIColor *pinkLightOp = [UIColor colorWithRed:0.79f green:0.45f blue:0.57f alpha:1.0];
CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = [[shareWordButton layer] bounds];
gradient.cornerRadius = 7;
gradient.colors = [NSArray arrayWithObjects:
(id)pinkDarkOp.CGColor,
(id)pinkLightOp.CGColor,
nil];
gradient.locations = [NSArray arrayWithObjects:
[NSNumber numberWithFloat:0.0f],
[NSNumber numberWithFloat:0.7],
nil];
[[recordButton layer] insertSublayer:gradient atIndex:0];
Ответ 7
Я достигаю этого в представлении с подзоном, который является UIImageView. Изображение, на которое обращается ImageView, является градиентом. Затем я устанавливаю цвет фона в UIView, и у меня есть цветное представление градиента. Затем я использую представление так, как мне нужно, и все, что я рисую, будет находиться под этим видом градиента. Добавив второй вид поверх ImageView, вы можете иметь некоторые параметры, будет ли ваш рисунок ниже или выше градиента...