GithubHelp home page GithubHelp logo

natalia-osa / norosettaview Goto Github PK

View Code? Open in Web Editor NEW
38.0 7.0 8.0 486 KB

Circle arc based control with selected number of leafs (pizza style).

License: Apache License 2.0

Ruby 2.60% Objective-C 97.40%

norosettaview's Introduction

Version Platform License

NORosettaView

Circle arc based control with selected number of leaves (like a pizza).

Examples:

NORosettaView NORosettaView

Customisable outlook:

  • set the angle where to start drawing (eg draw from top),
  • set the total angle of the drawing (eg 180 degrees, so half of the circle),
  • set number of arcs to display,
  • change size of the margin between arcs,
  • customise the background color of selected and not selected arc,
  • change the thickness of the drawing (draw full arc to the middle of the circle or just the border),
  • add text on each arc (round label),
  • customise details like shadows,
  • respond to tap on each leaf (take advantage of blocks).

NORosettaView img1 NORosettaView img1 NORosettaView img1

Implementation:

Please refer to the demo for more in depth examples or check out source code.

NORVView

  • actionBlock - Allows to react to user interaction (taps).
[rosettaView setActionBlock:^(NORVView *view, NSUInteger selectedIndex) {
    [view setSelectedIndex:selectedIndex];
    [weakSelf updateView:view withSelectedIndex:selectedIndex];
}];
  • selectedIndex - Determines the index of selected arc in the circle.
[rosettaView setSelectedIndex:selectedIndex];
[rosettaView setLeaves:@[leaf1, leaf2, leaf3]];
  • startAngle - Determines the position where to start drawing the arcs. Default 180 degrees, which is left middle.
 [rosettaView setStartAngle:45.f];
  • totalAngle - Determines the angle on which all arcs should be drawn. Eg 180 will make half of the circle filled with arcs, rest will be empty.
 [rosettaView setTotalAngle:90.f];
  • marginAngle - Determines the angle between arcs on the outer side of the circle.
 [rosettaView setMarginAngle:5.f];
  • thickness - Determines the width which should be filled with color. 1 causes a border, radius causes full fill with the color.
[rosettaView setThickness:70.f];
  • shadowWidth - Determines the width of shadow around the elements.
 [rosettaView setShadowWidth:5];
  • shadowColor - Determines the color of shadow around the elements.
 [rosettaView setShadowColor:[UIColor blackColor]];

NORVLeaf

  • rosettaLeafWithColor:selectedColor:circleTextView: - Convenience initializer for leaf objects, with basic setup.
[NORVLeaf rosettaLeafWithColor:[UIColor grayColor]
                                         selectedColor:[UIColor blackColor]
                                        circleTextView:[NORVCircleTextView rosettaCircleText:@"Button" withTextAttributes:nil]];
  • color - Determines the color of not selected element.
 [leaf setColor:[UIColor blackColor]];
  • selectedColor - Determines the color of the selected element.
 [leaf setSelectedColor:[UIColor blackColor]];
  • circleTextView - Determines the label with rounded text.
 [leaf.circleTextView setTextAttributes:(i == selectedIndex) ? selectedTextAttributes : textAttributes];

NORVCircleTextView

Inherits from XMCircleTypeView (credits: XMCircleType). Is used to display the text on each leaf.

  • rosettaCircleText:withTextAttributes: - Convenience initializer for text with attrubutes.
[NORVCircleTextView rosettaCircleText:NSLocalizedString(@"Quite Long Button", nil)
                                                                       withTextAttributes:nil];

Installation:

Installation with CocoaPods

CocoaPods is a dependency manager for Objective-C, which automates and simplifies the process of using 3rd-party libraries.

pod "NORosettaView"

Submodule

In your projects git folder type:

git submodule init
git submodule add --copy link to the repo--
git submodule update

Copy all files from NORosettaView/RosettaView folder.

Just download & attach

This is strongly misadvised as you won't be able to see code updates. Clone or download the source, copy all files from RosettaView folder.

ChangeLog

  • 0.1 Added basic project, configured styling, added first cocoapod.

Author

Natalia Osiecka, [email protected]

License

Available under the Apache 2.0 license. See the LICENSE file for more info.

Requirements

Requires Xcode 6, targeting either iOS 6.0 or higher.

Bitdeli Badge

norosettaview's People

Contributors

natalia-osa avatar bitdeli-chef avatar

Stargazers

Yasin ATEŞ avatar  avatar  avatar  avatar Vamsi Anguluru avatar Nemanja avatar Mehul Akoliya avatar coderHooge avatar Maxim Melikhov avatar  avatar Alessandro Aresta avatar Mario Mosca avatar  avatar Pedro Paulo Amorim avatar Hardik Amal avatar Pranav Lathigara avatar  avatar  avatar Gustavo Rago avatar  avatar Michael Pchelnikov avatar Cem Olcay avatar  avatar Ernest Semerda avatar  avatar Danish A. Ansari avatar Martin Høst Normark avatar MohsinAli avatar server avatar Balram Tiwari avatar Mukesh Mandora avatar  avatar Erekle Meskhi avatar Kevin Hirsch avatar Carabineiro avatar Dan avatar  avatar Patryk Kaczmarek avatar

Watchers

James Cloos avatar MohsinAli avatar Mehul Akoliya avatar  avatar Balram Tiwari avatar Carabineiro avatar server avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.