Deploy website - based on 8b6abd75f8
This commit is contained in:
@@ -8,17 +8,17 @@
|
||||
<script>window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)},ga.l=+new Date,ga("create","UA-145065218-1","auto"),ga("send","pageview")</script>
|
||||
<script async src="https://www.google-analytics.com/analytics.js"></script>
|
||||
<link rel="search" type="application/opensearchdescription+xml" title="NodeGui" href="/opensearch.xml"><title data-react-helmet="true">Scroll Area | NodeGui</title><meta data-react-helmet="true" name="docsearch:version" content="current,latest"><meta data-react-helmet="true" name="twitter:card" content="summary_large_image"><meta data-react-helmet="true" property="og:title" content="Scroll Area | NodeGui"><meta data-react-helmet="true" name="description" content="ScrollArea allows you to display a large content (image, list or even plain text) in an area of predefined size. A scroll area is used to display the contents of a child widget within a frame. If the widget exceeds the size of the frame, the view can provide scroll bars so that the entire area of the child widget can be viewed."><meta data-react-helmet="true" property="og:description" content="ScrollArea allows you to display a large content (image, list or even plain text) in an area of predefined size. A scroll area is used to display the contents of a child widget within a frame. If the widget exceeds the size of the frame, the view can provide scroll bars so that the entire area of the child widget can be viewed."><meta data-react-helmet="true" property="og:url" content="https://nodegui.org/docs/guides/scroll-view"><link data-react-helmet="true" rel="shortcut icon" href="/img/favicon.ico"><link data-react-helmet="true" rel="preconnect" href="https://BH4D9OD16A-dsn.algolia.net" crossorigin="true"><link data-react-helmet="true" rel="canonical" href="https://nodegui.org/docs/guides/scroll-view"><link rel="stylesheet" href="/styles.920797bd.css">
|
||||
<link rel="preload" href="/styles.b26071d3.js" as="script">
|
||||
<link rel="preload" href="/runtime~main.3f565526.js" as="script">
|
||||
<link rel="preload" href="/main.370dc7bf.js" as="script">
|
||||
<link rel="preload" href="/1.8c26fc17.js" as="script">
|
||||
<link rel="preload" href="/2.a58adc95.js" as="script">
|
||||
<link rel="preload" href="/3.a3e7cf31.js" as="script">
|
||||
<link rel="preload" href="/1be78505.a1382a2b.js" as="script">
|
||||
<link rel="preload" href="/373.6b7f8a1a.js" as="script">
|
||||
<link rel="preload" href="/935f2afb.f2b85bb4.js" as="script">
|
||||
<link rel="preload" href="/17896441.017d56ce.js" as="script">
|
||||
<link rel="preload" href="/76e4d282.f68f0ae3.js" as="script">
|
||||
<link rel="preload" href="/styles.7e5537e6.js" as="script">
|
||||
<link rel="preload" href="/runtime~main.0d22e379.js" as="script">
|
||||
<link rel="preload" href="/main.28d05f5a.js" as="script">
|
||||
<link rel="preload" href="/1.0788d628.js" as="script">
|
||||
<link rel="preload" href="/2.ea87302a.js" as="script">
|
||||
<link rel="preload" href="/3.ad1fd916.js" as="script">
|
||||
<link rel="preload" href="/1be78505.75469ff7.js" as="script">
|
||||
<link rel="preload" href="/374.e914d883.js" as="script">
|
||||
<link rel="preload" href="/935f2afb.7ccecc3e.js" as="script">
|
||||
<link rel="preload" href="/17896441.b80185ea.js" as="script">
|
||||
<link rel="preload" href="/76e4d282.e9dc8cfd.js" as="script">
|
||||
</head>
|
||||
<body>
|
||||
<script>!function(){function t(t){document.documentElement.setAttribute("data-theme",t)}var e=function(){var t=null;try{t=localStorage.getItem("theme")}catch(t){}return t}();t(null!==e?e:"light")}()</script><div id="__docusaurus">
|
||||
@@ -33,16 +33,16 @@
|
||||
</span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">It is a long established </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">fact that a reader will be distracted by </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">the readable content of a page when looking at its layout. </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">The point of using Lorem Ipsum is that it has </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">a more-or-less normal distribution of letters, </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">as opposed to using 'Content here, content here', </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">making it look like readable English. </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">Many desktop publishing packages and web page </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">editors now use Lorem Ipsum as their default model text, </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">and a search for 'lorem ipsum' will uncover many web </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">sites still in their infancy. Various versions </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">have evolved over the years, sometimes by accident, </span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)">sometimes on purpose (injected humour and the like).</span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="display:inline-block;color:rgb(195, 232, 141)">
|
||||
</span></div><div class="token-line" style="color:#bfc7d5"><span class="token template-string string" style="color:rgb(195, 232, 141)"></span><span class="token template-string template-punctuation string" style="color:rgb(195, 232, 141)">`</span><span class="token punctuation" style="color:rgb(199, 146, 234)">)</span><span class="token punctuation" style="color:rgb(199, 146, 234)">;</span></div></div></div></div></div><p><strong>TLDR;</strong></p><p>We create a QScrollArea instance and use the setWidget method to insert a widget as its child.
|
||||
QScrollArea can take any widget as its child.</p><p>The result would look like this:</p><img src="https://github.com/nodegui/nodegui/releases/download/assets/scrollarea.gif" alt="scroll area" style="width:100%;max-width:400px"></div></article><div class="margin-vert--xl"><div class="row"><div class="col"><a href="https://github.com/nodegui/nodegui/edit/master/website/docs/guides/scroll-view.md" target="_blank" rel="noreferrer noopener"><svg fill="currentColor" height="1.2em" width="1.2em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 40 40" style="margin-right:0.3em;vertical-align:sub"><g><path d="m34.5 11.7l-3 3.1-6.3-6.3 3.1-3q0.5-0.5 1.2-0.5t1.1 0.5l3.9 3.9q0.5 0.4 0.5 1.1t-0.5 1.2z m-29.5 17.1l18.4-18.5 6.3 6.3-18.4 18.4h-6.3v-6.2z"></path></g></svg>Edit this page</a></div></div></div><div class="margin-vert--lg"><nav class="pagination-nav" aria-label="Blog list page navigation"><div class="pagination-nav__item"><a class="pagination-nav__link" href="/docs/guides/handle-events"><div class="pagination-nav__sublabel">Previous</div><div class="pagination-nav__label">« Handle Events</div></a></div><div class="pagination-nav__item pagination-nav__item--next"><a class="pagination-nav__link" href="/docs/guides/images"><div class="pagination-nav__sublabel">Next</div><div class="pagination-nav__label">Images »</div></a></div></nav></div></div></div><div class="col col--3"><div class="tableOfContents_3SO_"><ul class="table-of-contents table-of-contents__left-border"><li><a href="#example" class="table-of-contents__link">Example</a></li></ul></div></div></div></div></main></div></div><footer class="footer footer--dark"><div class="container"><div class="row footer__links"><div class="col footer__col"><h4 class="footer__title">Docs</h4><ul class="footer__items"><li class="footer__item"><a class="footer__link-item" href="/docs/guides/getting-started">Getting Started</a></li><li class="footer__item"><a class="footer__link-item" href="/docs/api/manual/synopsis">API</a></li></ul></div><div class="col footer__col"><h4 class="footer__title">Community</h4><ul class="footer__items"><li class="footer__item"><a href="https://spectrum.chat/nodegui" target="_blank" rel="noopener noreferrer" class="footer__link-item">Spectrum</a></li><li class="footer__item"><a href="https://nodegui.slack.com" target="_blank" rel="noopener noreferrer" class="footer__link-item">Slack</a></li><li class="footer__item"><a href="https://twitter.com/node_gui" target="_blank" rel="noopener noreferrer" class="footer__link-item">Twitter</a></li><li class="footer__item"><a href="https://medium.com/nodegui" target="_blank" rel="noopener noreferrer" class="footer__link-item">Medium</a></li></ul></div><div class="col footer__col"><h4 class="footer__title">More</h4><ul class="footer__items"><li class="footer__item"><a class="footer__link-item" href="/blog">Blog</a></li><li class="footer__item"><a href="https://react.nodegui.org" target="_blank" rel="noopener noreferrer" class="footer__link-item">React NodeGui</a></li><li class="footer__item"><a class="footer__link-item" href="/docs/faq">FAQ</a></li></ul></div></div><div class="text--center"><div>Copyright © 2020 NodeGui</div></div></div></footer></div>
|
||||
<script src="/styles.b26071d3.js"></script>
|
||||
<script src="/runtime~main.3f565526.js"></script>
|
||||
<script src="/main.370dc7bf.js"></script>
|
||||
<script src="/1.8c26fc17.js"></script>
|
||||
<script src="/2.a58adc95.js"></script>
|
||||
<script src="/3.a3e7cf31.js"></script>
|
||||
<script src="/1be78505.a1382a2b.js"></script>
|
||||
<script src="/373.6b7f8a1a.js"></script>
|
||||
<script src="/935f2afb.f2b85bb4.js"></script>
|
||||
<script src="/17896441.017d56ce.js"></script>
|
||||
<script src="/76e4d282.f68f0ae3.js"></script>
|
||||
<script src="/styles.7e5537e6.js"></script>
|
||||
<script src="/runtime~main.0d22e379.js"></script>
|
||||
<script src="/main.28d05f5a.js"></script>
|
||||
<script src="/1.0788d628.js"></script>
|
||||
<script src="/2.ea87302a.js"></script>
|
||||
<script src="/3.ad1fd916.js"></script>
|
||||
<script src="/1be78505.75469ff7.js"></script>
|
||||
<script src="/374.e914d883.js"></script>
|
||||
<script src="/935f2afb.7ccecc3e.js"></script>
|
||||
<script src="/17896441.b80185ea.js"></script>
|
||||
<script src="/76e4d282.e9dc8cfd.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user