Hello, Kyle,
thank you for contacting us.
For detailed customization of the event showing in the cell you need to either override the
UpdateVisualsForCell() method of
TKCalendarDelegate or create your own custom cell.
For this example I've created a custom cell, so we would be able to attach different UI elements to it easier.
This is what the class looks like :
public
class
CustomCell : TKCalendarDayCell
{
public
UILabel EventLabel {
get
;
set
;
}
public
CustomCell ()
{
this
.EventLabel =
new
UILabel(
new
CGRect());
this
.EventLabel.TextColor =
new
UIColor (0, 0, 0, 1);
this
.AddSubview (
this
.EventLabel);
}
public
override
void
LayoutSubviews ()
{
base
.LayoutSubviews ();
this
.EventLabel.Frame =
new
CGRect (
this
.Frame.Size.Width - 10,
this
.Frame.Size.Height - 10, 10, 10);
}
public
override
void
UpdateVisuals ()
{
base
.UpdateVisuals ();
if
(
this
.Events !=
null
) {
if
(
this
.Events.Length > 0) {
this
.EventLabel.Text =
"1"
;
}
this
.Style.TextInsets =
new
UIEdgeInsets (0, 25, 30, 0);
this
.Style.EventTextColor =
new
UIColor (0.4f, 0.6f, 0.8f, 1.0f);
this
.Style.EventShape =
new
TKPredefinedShape (TKShapeType.Circle,
new
CGSize (13, 13));
}
}
public
override
void
Draw (CGRect rect)
{
base
.Draw (rect);
}
}
In few steps I've added a
UILabel for the event title to appear next to your event shape, as you've mentioned that this is one of your goals. By using
TKCalendarDayCell's
Style property of type
TKCalendarDayCellStyle you are able to customize the look of the cell and its components. In the above example some of them are demonstrated.
In order to use the custom cell you have created you need to pass it to the calendar by overriding the method
ViewForCellOfKind() of
TKCalendarDelegate.
As you have updated your question and you have almost achieved the desired scenario, please notice that if you have set
DisplayEventsAsText property to
true moving the event around the cell will be available through
EventInsets property of the Style. If
DisplayEventsAsText is set to false you can use the EventAlignment property to adjust the event's position.
Moving the Date text around the cell could be done by adjusting its TextInset property:
I hope this points you in the right direction. If you have other questions I will be glad to assist you.
Regards,
Yoanna
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the
Telerik Feedback Portal and vote to affect the priority of the items