skycons
torryharris
195
Visit GitHub RepoIcons

Skycons for Android Android Arsenal

Skycons

We set out to create a native weather app on Xamarin but we wanted to build something unique to differentiate ourselves amongst the plethora of weather apps avaialble out there. The DarkSky app & Forecast did an excellent job with their Skycons.

We wanted to re-use the same icons for our app as well, however, we found that these animated icons don't exist natively on either platforms. This is currently a work-in-progress as the team is finetuning the animation & the performance itself. You can download the complete repository which also contains the sample project SkyconsDemo.

Built with Android Studio (2.2.3)

Available Icons

Icon View
Cloud CloudView
Clear Sky (Sunny) SunView
Clear Night MoonView
Partly Cloudy Day CloudSunView
Partly Cloudy Night CloudMoonView
Heavy Showers CloudHvRainView
Snow CloudSnowView
Light Showers CloudRainView
Fog CloudFogView
Wind WindView
Thunder CloudThunderView

How to use

  • Deployment target should be API level 14 or above.
  • Import 'SkyconsLibrary' as a library to your project.

Adding icons:

1) To add a skycon(icon) through the XML:
                 
       <com.thbs.skycons.library.<skycon>
         android:layout_width="250dp"
         android:layout_height="250dp"
         android:layout_centerHorizontal="true"
         android:layout_centerVertical="true"
         app:isStatic = "true"
         app:strokeColor = "#000000"
         app:bgColor = "#ffffff"/>

where <skycon> represents the particular view/icon. For example "MoonView"


2) To add a skycon(For instance, WindView) through Java code, perform following in the activity:

      
        LinearLayout layout = new LinearLayout(this);
        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
            LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
        layout.setLayoutParams(params);
    
        //Using these params, you can control view attributes
        //attributres include boolean isStatic,boolean isAnimated, int strokeColor , int backgroundColor
        WindView windView = new WindView(this,true,false, Color.parseColor("#000000"),Color.parseColor("#ffffff"));          
        
        //Using these params, you can control width & height of the icon
        params.width = 200;
        params.height = 200;
        windView.setLayoutParams(params);
      
        layout.addView(windView);
        this.setContentView(layout);
  • For a better experience, keep 'layout_width' & 'layout_height' the same.

Customization:

Options Value Description
layout_width 100dp (recommended min value) Width of icon
layout_height 100dp (recommended min value) Height of the icon
isStatic True / False Boolean Value to enable on-touch animation
strokeColor HEX Customize the color of the icon
bgColor HEX Customize the background colour

Pull Requests are welcomed. We are looking forward for your suggestions on new icons & animations.

##Demo Get it on Google Play

License

Skycons for Android is being made available in public domain under similar terms like the original

Become a better Android Developer
Millions of developers are learning at MindOrks

Online Training Program

Featured Blogs

Our Team

MindOrks is Certainly one of the best online blog to stay on top of all the Android development news, coding and design patterns. Finally a blog I can count on to keep myself updated with latest and greatest things happening in Android world.

Vipul Shah
Android Developer
Microsoft

Become Pro in Android by watching videos

OUR LEARNERS WORK AT