Creating Native mobile Stock & Crypto Trading apps with SciChart
Published: 2024-04-05 10:51:05

<!-- wp:paragraph -->
<p>SciChart is a powerful charting and data visualisation component with many applications across sectors. <a href="https://www.scichart.com/why-scichart-best-for-financial-stock-trading-applications/">One of these is finance &amp; trading</a>. With the recent cryptocurrency boom and Robinhood trading phenomenon, we see more and more popularity for building finance &amp; trading applications using SciChart.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>We often get asked <strong>'Does SciChart support technical indicators?'</strong></p>
<!-- /wp:paragraph -->

<!-- wp:html -->
<div style="background-color: #f3f3f3; border: 1px solid #E3E3E3; padding: 20px 20px 0px 20px; margin-bottom: 20px;">
<h2><span style="color: #078e26;">//</span> SciTrader App is now released!</h2>
<div class="column one-second column_column">
<p>SciTrader, our <a href="https://www.scitrader.io" target="_blank" rel="noopener">Cryptocurrency Trading App</a> is now released!</p>
<p><em>“Utilising SciChart's Award-Winning iOS &amp; Android Chart Library, the <a href="https://scitrader.io" target="_blank" rel="noopener">SciTrader App</a> provides an innovative altcoin heatmap, a live cryptocurrency watchlist and rich interactive trading charts with realtime data updates, technical indicators, zooming &amp; panning and more …” <a href="https://www.scitrader.io/" target="_blank" rel="noopener">[learn more]</a></em></p>
<figure><img style="width: 100%;" src="https://www.scichart.com/wp-content/uploads/2021/08/scitrader-perspective-phones@2x.png" /></figure>
<p>&nbsp;</p>
</div>
<div class="column one-second column_column">
<p>We are packaging <a href="https://scitrader.io" target="_blank" rel="noopener">SciTrader</a> as a FREE app on iOS and Android showcasing the speed &amp; power of the <a href="https://www.scichart.com" target="_blank" rel="noopener">SciChart SDK</a> for realtime, interactive trading charts.</p>
<p>A Javascript version of the SciTrader app will also be published soon, as well as the <a href="https://scitrader.io/charts-sdk" target="_blank" rel="noopener">SciTrader SDK</a> - a powerful SDK allowing you to include trading charts with automatic data management, technical indicators, zooming &amp; panning and more into native iOS (Swift), Android (Kotlin) and JavaScript browser applications</p>
<p><a class="button button-highlight" style="margin-bottom: 0px;" tabindex="0" href="https://www.scitrader.io/" target="_blank" rel="noopener">Learn More at https://scitrader.io</a></p>
</div>
<div class="clear"> </div>
</div>
<!-- /wp:html -->

<!-- wp:paragraph -->
<p>It is a common feature request and there are open-source TA indicator libraries out there that you can integrate to SciChart. However, creating a framework or financial chart component with editable settings and user interactivity is a big piece of work.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>So, we decided to present SciChart's capabilities by doing this work for you, by creating a financial charting component for use when developing mobile iOS/Android cryptocurrency or stock trading applications.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Here's a video below where I talk about a demo application we've created, called SciTrader, which uses this new mobile financial charting component:</p>
<!-- /wp:paragraph -->

<!-- wp:html -->
<figure class="kg-card kg-embed-card"><iframe src="https://www.youtube.com/embed/xHNN9jvkZss?feature=oembed" width="200" frameborder="0" allowfullscreen="allowfullscreen"></iframe></figure>
<!-- /wp:html -->

<!-- wp:heading -->
<h2 id="our-financial-charting-component">Our Financial Charting Component</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p><strong>We've created a financial charting component which has the following features</strong> <strong>that trading app developers and users expect to see. </strong></p>
<!-- /wp:paragraph -->

<!-- wp:quote -->
<blockquote class="wp-block-quote">
<p>This component is in development now and is in preview. Supporting Swift/Kotlin it is developed for mobile platforms, but we will be adding a JavaScript version soon.<br />It is likely that we will have something ready for sale in the next couple of months. <strong>We are also able to accept orders now for consultancy work</strong> for integration of our component to your application. <a href="https://www.scichart.com/contact-us/">Contact sales</a> if this is of interest.</p>
</blockquote>
<!-- /wp:quote -->

<!-- wp:paragraph -->
<p>We've taken the work out of building an iOS or Android mobile trading application by building a framework for managing indicators and financial charting.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Here are some of the features we have created so far.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3 id="technical-indicators">Technical Indicators</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>SciChart's financial charting component supports over 20 technical indicators, with a possibilty to add more.</p>
<!-- /wp:paragraph -->

<!-- wp:image {"id":33114,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img class="wp-image-33114" src="https://www.scichart.com/wp-content/uploads/2022/05/SciChart-Financial-Chart-Component-iOS-Android-Mobile-Indicators.png" alt="" />
<figcaption>SciChart's iOS/Android (Mobile) Financial Chart Component supports technical indicators</figcaption>
</figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>Indicators we support include:</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul>
<li>Simple and Exponential Moving Averages</li>
<li>Relative Strength Indicator (RSI)</li>
<li>Bollinger Bands</li>
<li>Moving Average Convergence Divergence (MACD)</li>
<li>Commodity Channel Index (CCI)</li>
<li>Hilbert Transform</li>
<li>Parabolic SAR</li>
<li>On Balance Volume (OBV)</li>
<li>Standard Deviation</li>
<li>Average True Range</li>
</ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>We've built a framework for incorporating technical indicators and piping data from an abitrary data-source (which can be exchange, or local store of data), through to indicators which can then be rendered on the chart. Indicators can be placed on indicators e.g. Moving Average on RSI. This is quite a bit of work and very valuable on it's own. If you are considering to build a trading app with SciChart, t<a href="https://www.scichart.com/contact-us/">hen get in contact with our sales team</a>, as we can help you get to market faster.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>This framework or architecture allows for custom indicators to be added or for the list above to be modified in order to build fully-featured trading applications using our flexible, powerful, <a href="https://www.scichart.com/ios-chart-features/">iOS/Android Chart library</a>.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3 id="multi-pane-stock-cryptocurrency-charts">Multi Pane Stock/Cryptocurrency Charts</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>SciChart supports linked multi-pane stock charts, and so does our financial chart component.</p>
<!-- /wp:paragraph -->

<!-- wp:image {"id":33118,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img class="wp-image-33118" src="https://www.scichart.com/wp-content/uploads/2022/05/SciChart-Financial-Chart-Component-iOS-Android-Mobile-Multi-Pane-Stock-Charts-1.png" alt="" />
<figcaption>SciChart iOS/Android supports multi-pane stock charts or crypto currency trading charts</figcaption>
</figure>
<!-- /wp:image -->

<!-- wp:heading {"level":3} -->
<h3 id="ability-to-change-instrument">Ability to Change Instrument</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>We've built into a demo app the ability to change instrument by selecting a dropdown. In this case our instrument list are cryptocurrencies or coins from the Binance exchange. Our code can be adapted to integrate to any exchange or datasource.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3 id="ability-to-change-timeframe">Ability to Change Timeframe</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>In our demo app you can change timeframe, e.g. 1-minute, 5-minute, 15-minute, hourly, 4-hour or daily charts are all supported and more. Again, we are using historical data and live market data from Binance, but any datasource can be integrated.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3 id="rich-zooming-panning-and-scaling-via-touch">Rich Zooming, Panning and Scaling via Touch</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Our financial charting component supports rich zooming, panning and scaling via touch. Check out the short video below showing how it is possible to pinch zoom the main chart on an iOS or Android device, scale the axis via panning or pan the main chart. All chart panes move in unison as they have been synchronized using our multi-chart API.</p>
<!-- /wp:paragraph -->

<!-- wp:html -->
{% embed https://www.youtube.com/embed/HwoOg8jnlTU %}
<figure class="kg-card kg-embed-card kg-card-hascaption">
<figcaption>SciChart's Financial Chart Component for iOS/Android apps supports rich scaling, zooming and panning via touch</figcaption>
</figure>
<!-- /wp:html -->

<!-- wp:heading {"level":3} -->
<h3 id="cursors-and-active-legends">Cursors and Active Legends</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>We've developed a custom cursor and active legend for our Financial Chart component. This is using our ChartModifier API - part of the SciChart iOS/Android SDK - which allows you to code custom behaviours which respond to touch gestures.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>The legend is placed in the top left of each chart and shows the values of the price series and indicator series under the cursor. The cursor may be positioned with touch and enabled or disabled via a button on the UI.</p>
<!-- /wp:paragraph -->

<!-- wp:html -->
{% embed https://www.youtube.com/embed/PTG_i3zsRt8?feature=oembed %}
<figure class="kg-card kg-embed-card kg-card-hascaption">
<figcaption>SciChart's Financial Chart Component for iOS/Android apps supports active legends and cursors in Multi-pane stock trading or cryptocurrency trading apps</figcaption>
</figure>
<!-- /wp:html -->

<!-- wp:heading {"level":3} -->
<h3 id="full-customisation-of-indicator-styles">Full Customisation of Indicator styles</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>SciChart's financial chart framework supports dynamic changing of indicator properties, which could include Moving Average length or RSI length, as well as indicator styles such as line width, line dash and line or fill colour. Watch the short video below where you can us modifying the indicator style and color dynamically through the app.</p>
<!-- /wp:paragraph -->

<!-- wp:html -->
{% embed https://www.youtube.com/embed/6xV2O8Wm4tc?feature=oembed %}
<figure class="kg-card kg-embed-card kg-card-hascaption">
<figcaption>SciChart's Financial Chart Component for iOS/Android apps supports editing indicator properties, styles and colours in multi-pane stock trading or cryptocurrency trading apps</figcaption>
</figure>
<!-- /wp:html -->

<!-- wp:heading {"level":3} -->
<h3 id="integration-to-live-markets">Integration to live markets</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>In our demo we showcase connection to Binance cryptocurrency exchange for live and historical market data. New prices are sent via Websocket to our demo application and the <a href="https://www.scichart.com/example/javascript-chart/javascript-candlestick-chart/">candlestick chart</a> and all indicators update. This datasource can be swapped out and theoretically we can modify the code to fit whatever datasource you wish, be it your own exchange as a broker, or a custom datafeed to stock or cryptocurrency exchanges.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>SciChart is a high-performance chart library/SDK which has plenty of power to draw lots of series, markers and chart elements without introducing slowdown into your app.</p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 id="future-work">Future work</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>So what do we plan to do with this?</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>We plan to continue developing this financial chart component, adding the ability to draw trendlines, add text using <a href="https://www.scichart.com/example/ios-chart/ios-chart-chart-annotations-are-easy-example/">SciChart's rich Annotations API</a>. We also intend to add drawing tools such as Fibonacci Retracement and other popular financial drawings to the chart.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>We plan to build a version using our JavaScript charts which will support browser-based or electron applications written in JavaScript or TypeScript.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>We plan to ship the financial chart component as an add-on or plugin to SciChart and we will also be available to work with your teams integrating to your applications on mobile or javascript if you require.</p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 id="get-in-contact-for-more-info">Get in Contact for more info</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p><strong>If you are running a brokerage, cryptocurrency or stock exchange, are a proprietary trading firm, hedge fund or CFD/spread bet provider and you are interested in SciChart for your trading apps, <a href="https://www.scichart.com/contact-us/">get in touch with sales</a> and tell us your requirements. </strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>We would love to hear from you and show how we can help you get your product to market fast!</strong></p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 id="about-scichart-cross-platform-charts-for-finance-trading"><em>About SciChart: Cross-Platform Charts for Finance &amp; Trading</em></h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p><em>SciChart is a very capable <a href="https://www.scichart.com">chart component</a>. With support for multi-platform including Windows (<a href="https://www.scichart.com/wpf-chart-features/">WPF</a>, C#), native iOS &amp; Android, Mac OSX and <a href="https://www.scichart.com/javascript-chart-features/">JavaScript Charts</a> with our powerful, <a href="https://www.scichart.com/scichart-js-update-fast-realtime-javascript-charts/">fast SciChart.js component</a>, there's a myriad of applications you can create from financial, to scientific, medical and business dashboarding apps.</em></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><em>Our customers (exchanges, brokerages and banks), have used our award-winning chart software to create desktop financial &amp; trading apps, as well as mobile trading apps and we are working to add features for the fintech sector to make SciChart more appealing to this market. </em></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><em><strong>We ourselves are able to offer <a href="/expert-consultants-in-high-performance-data-visualisation/">consultancy with our experts in finance, trading apps as well as high performance data-visualisation</a></strong>. If you wish us to develop an application or consult on the best way to use SciChart then <a href="https://www.scichart.com/contact-us/">contact sales</a>, we would be very pleased to help! </em></p>
<!-- /wp:paragraph -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://www.scichart.com/wp-content/uploads/2020/08/why-scichart-finance.png" alt="" /></figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p><!--kg-card-begin: html--> <!--kg-card-end: html--></p>
<!-- /wp:paragraph -->