このセクションでは、iOS アプリに FlexPie コントロールを追加し、そこにデータを追加する方法について説明します。Objective-C で xuni コントロールを追加する方法については、「Objective-C による Xuni コントロールの追加」を参照してください。
このトピックは 3 つの手順で構成されます。
次の図は、上記の手順を実行した後の FlexPie を示しています。
手順 1：FlexPie のデータソースの作成
- Project Navigator で、プロジェクト名を右クリックします。
- 新しいファイルを選択します。［新しいファイルのテンプレートを選択］ダイアログが表示されます。
- OS X の下で、［ソース］→［Cocoa クラス］を選択します。
- ［次へ］をクリックします。クラスに「PieData」と名前を付け、ドロップダウンからサブクラスとして NSObject を選択します。
これで、PieData.swift、PieData.h と PieData.m がアプリケーションに追加されます。新しいヘッダーと Objective-C ファイルを追加する方法については、「Objective-C による Xuni コントロールの追加」を参照してください。PieData.h および PieData.m ファイルに、次のコードを追加します。
import Foundation
class PieData: NSObject
{
var name: String
var value: Double
init(name: String, value: Double)
{
self.name = name
self.value = value
}
class func demoData() -> NSMutableArray{
return[
PieData(name: "Oranges", value: Double(arc4random()%101)),
PieData(name: "Apples", value: Double(arc4random()%101)),
PieData(name: "Pears", value: Double(arc4random()%101)),
PieData(name: "Bananas", value: Double(arc4random()%101)),
PieData(name: "Pineapples", value: Double(arc4random()%101))
]
}
}
#import <Foundation/Foundation.h>
@interface PieData : NSObject
@property NSString *name;
@property NSNumber *value;
-(id)initWithName: (NSString *)name value: (NSNumber *)value;
+(NSMutableArray *)demoData;
@end
#import "PieData.h"
@implementation PieData
-(id)initWithName:(NSString *)name value:(NSNumber *)value{
self = [super init];
if(self){
_name = name;
_value = value;
}
return self;
}
//Add random data.
+(NSMutableArray *) demoData{
PieData *Oranges = [[PieData alloc] initWithName:@"Oranges"
value:[NSNumber numberWithUnsignedInteger:(arc4random()%101)]];
PieData *Apples = [[PieData alloc] initWithName:@"Apples"
value:[NSNumber numberWithUnsignedInteger:(arc4random()%101)]];
PieData *Pears = [[PieData alloc] initWithName:@"Pears"
value:[NSNumber numberWithUnsignedInteger:(arc4random()%101)]];
PieData *Bananas = [[PieData alloc] initWithName:@"Bananas"
value:[NSNumber numberWithUnsignedInteger:(arc4random()%101)]];
PieData *Pineapples = [[PieData alloc] initWithName:@"Pineapples"
value:[NSNumber numberWithUnsignedInteger:(arc4random()%101)]];
return [[NSMutableArray alloc] initWithObjects:Oranges, Apples, Pears, Bananas, Pineapples, nil];
}
@end
using System;
using System.Collections.Generic;
namespace Xuni_QuickStart
{
public class FlexPieDataSource
{
private List<FruitEntity> entityList;
public List<FruitEntity> Data
{
get { return entityList; }
}
public FlexPieDataSource()
{
entityList = new List<FruitEntity>();
string[] fruits = new string[] { "Oranges", "Apples, "Pears", "Bananas", "Pineapples" };
Random random = new Random();
for (int i = 0; i < fruits.Length; i++)
{
decimal value = (decimal)random.NextDouble() * 100;
entityList.Add(new FruitEntity(fruits[i], value));
}
}
}
public class FruitEntity
{
public string Name { get; set; }
public decimal Value { get; set; }
public FruitEntity(string name, decimal value)
{
this.Name = name;
this.Value = value;
}
}
}
手順 2：FlexPie コントロールの追加
FlexPie コントロールを初期化するには、次の手順を実行します。
ビューで FlexPie コントロールを追加します
- Project Navigator で、
MainStoryboardをクリックしてストーリーボードエディタを開きます。 - View Controller Scene の下で、View Controller を展開し、View をクリックします。
- ストーリーボードエディタの右端のペインで、ツールバーの
アイコンをクリックして Identity inspector を開きます。 - Custom Class の下で、ドロップダウンを使用してクラスを UI View から FlexPie に変更します。
コードで FlexPie コントロールを初期化します
FlexPie コントロールを初期化するには、Project Navigator から ViewController.m とViewController.swiftファイルを開き、その内容を次のコードで置き換えます。これは、FlexPie を初期化するために、View コントローラの viewDidLoad メソッドをオーバーライドします。
//必要なヘッダーファイルをインポートします。
import UIKit
import XuniFlexPieKit
class ViewController: UIViewController
{
//FlexPie コントロールを初期化します。
var pieChart = FlexPie()
override func viewDidLoad() {
super.viewDidLoad()
// ビューを読み込んだ後の追加セットアップを行います。
self.edgesForExtendedLayout = UIRectEdge.None
var pieData = NSMutableArray()
//FlexPie をデータにバインドします。
pieData = PieData.demoData()
pieChart.binding = "value"
pieChart.bindingName = "name"
pieChart.itemsSource = pieData
pieChart.tooltip.isVisible = true
self.view.addSubview(pieChart)
}
override func viewDidLayoutSubviews()
{
super.viewDidLayoutSubviews()
pieChart.frame = CGRectMake(0, 0, self.view.bounds.size.width, self.view.bounds.size.height/3)
}
}
//必要なヘッダーファイルをインポートします。
#import "ViewController.h"
#import "FlexPieKit/FlexPieKit.h"
#import "PieData.h"
@interface ViewController ()
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// ビューを読み込んだ後の追加セットアップを行います。
self.edgesForExtendedLayout = UIRectEdgeNone;
//FlexPie コントロールを初期化します。
FlexPie *pieChart = [[FlexPie alloc] initWithFrame:CGRectMake(0, 0, 300, 300)];
NSMutableArray *pieData = [PieData demoData];
//FlexPie をデータにバインドします。
pieChart.binding = @"value";
pieChart.bindingName = @"name";
pieChart.itemsSource = pieData;
[self.view addSubview:pieChart];
}
using System;
using UIKit;
namespace Xuni_QuickStart
{
public partial class ViewController : UIViewController
{
protected ViewController(IntPtr handle) : base(handle)
{
}
public override void ViewDidLoad()
{
base.ViewDidLoad();
//ライセンスの設定
Xuni.iOS.Core.XuniLicenseManager.Key = License.Key;
flexpie.ItemsSource = new FlexPieDataSource().Data;
flexpie.Binding = "Value";
flexpie.BindingName = "Name";
}
public override void DidReceiveMemoryWarning()
{
base.DidReceiveMemoryWarning();
}
}
}
手順 3：アプリケーションの実行
Command-R を押してアプリケーションを実行します。
関連トピック