https://reactnative-archive-august-2025.netlify.app/assets/js/2ed989b5.74847214.js

1"use strict";(self.webpackChunkreact_native_website=self.webpackChunkreact_native_website||[]).push([["12262"],{37034:function(e,s,r){r.r(s),r.d(s,{assets:()=>l,contentTitle:()=>d,default:()=>h,frontMatter:()=>o,metadata:()=>t,toc:()=>c});var t=r(69344),n=r(24246),i=r(80980);let o={id:"progressviewios",title:"\u{1F6A7} ProgressViewIOS"},d=void 0,l={},c=[{value:"Example",id:"example",level:3},{value:"Props",id:"props",level:2},{value:"<code>progress</code>",id:"progress",level:3},{value:"<code>progressImage</code>",id:"progressimage",level:3},{value:"<code>progressTintColor</code>",id:"progresstintcolor",level:3},{value:"<code>progressViewStyle</code>",id:"progressviewstyle",level:3},{value:"<code>trackImage</code>",id:"trackimage",level:3},{value:"<code>trackTintColor</code>",id:"tracktintcolor",level:3}];function a(e){let s={a:"a",blockquote:"blockquote",code:"code",div:"div",h1:"h1",h2:"h2",h3:"h3",hr:"hr",p:"p",strong:"strong",table:"table",tbody:"tbody",td:"td",th:"th",thead:"thead",tr:"tr",...(0,i.a)(),...e.components};return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(s.blockquote,{children:["\n",(0,n.jsxs)(s.p,{children:[(0,n.jsx)(s.strong,{children:"Removed."})," Use one of the ",(0,n.jsx)(s.a,{href:"https://reactnative.directory/?search=progressview",children:"community packages"})," instead."]}),"\n"]}),"\n",(0,n.jsxs)(s.p,{children:["Uses ",(0,n.jsx)(s.code,{children:"ProgressViewIOS"})," to render a UIProgressView on iOS."]}),"\n",(0,n.jsx)(s.h3,{id:"example",children:"Example"}),"\n",(0,n.jsx)(s.div,{className:"snack-player","data-snack-name":"ProgressViewIOS","data-snack-description":"Example usage","data-snack-files":"%7B%22App.tsx%22%3A%7B%22type%22%3A%22CODE%22%2C%22contents%22%3A%22import%20React%20from%20'react'%3B%5Cnimport%20%7BView%2C%20StyleSheet%2C%20ProgressViewIOS%2C%20Text%7D%20from%20'react-native'%3B%5Cn%5Cnconst%20App%20%3D%20()%20%3D%3E%20%7B%5Cn%20%20return%20(%5Cn%20%20%20%20%3CView%20style%3D%7Bstyles.container%7D%3E%5Cn%20%20%20%20%20%20%3CView%20style%3D%7Bstyles.example%7D%3E%5Cn%20%20%20%20%20%20%20%20%3CText%3EProgress%20Bar%20-%200%25%3C%2FText%3E%5Cn%20%20%20%20%20%20%20%20%3CProgressViewIOS%20style%3D%7Bstyles.progress%7D%20%2F%3E%5Cn%20%20%20%20%20%20%3C%2FView%3E%5Cn%20%20%20%20%20%20%3CView%20style%3D%7Bstyles.example%7D%3E%5Cn%20%20%20%20%20%20%20%20%3CText%3EColored%20Progress%20Bar%20-%2050%25%3C%2FText%3E%5Cn%20%20%20%20%20%20%20%20%3CProgressViewIOS%5Cn%20%20%20%20%20%20%20%20%20%20style%3D%7Bstyles.progress%7D%5Cn%20%20%20%20%20%20%20%20%20%20progressTintColor%3D%5C%22%5C%22%5Cn%20%20%20%20%20%20%20%20%20%20progress%3D%7B0.5%7D%5Cn%20%20%20%20%20%20%20%20%2F%3E%5Cn%20%20%20%20%20%20%3C%2FView%3E%5Cn%20%20%20%20%20%20%3CView%3E%5Cn%20%20%20%20%20%20%20%20%3CText%3EProgress%20Bar%20-%20100%25%3C%2FText%3E%5Cn%20%20%20%20%20%20%20%20%3CProgressViewIOS%5Cn%20%20%20%20%20%20%20%20%20%20style%3D%7Bstyles.progress%7D%5Cn%20%20%20%20%20%20%20%20%20%20progressTintColor%3D%5C%22black%5C%22%5Cn%20%20%20%20%20%20%20%20%20%20progress%3D%7B1%7D%5Cn%20%20%20%20%20%20%20%20%2F%3E%5Cn%20%20%20%20%20%20%3C%2FView%3E%5Cn%20%20%20%20%3C%2FView%3E%5Cn%20%20)%3B%5Cn%7D%3B%5Cn%5Cnconst%20styles%20%3D%20StyleSheet.create(%7B%5Cn%20%20container%3A%20%7B%5Cn%20%20%20%20flex%3A%201%2C%5Cn%20%20%20%20justifyContent%3A%20'center'%2C%5Cn%20%20%20%20alignItems%3A%20'center'%2C%5Cn%20%20%7D%2C%5Cn%20%20example%3A%20%7B%5Cn%20%20%20%20marginVertical%3A%2020%2C%5Cn%20%20%7D%2C%5Cn%20%20progress%3A%20%7B%5Cn%20%20%20%20width%3A%20200%2C%5Cn%20%20%7D%2C%5Cn%7D)%3B%5Cn%5Cnexport%20default%20App%3B%22%7D%7D","data-snack-dependencies":"react-native-safe-area-context","data-snack-platform":"web","data-snack-supported-platforms":"ios","data-snack-theme":"light","data-snack-preview":"true","data-snack-loading":"lazy","data-snack-device-frame":"false"}),"\n",(0,n.jsx)(s.hr,{}),"\n",(0,n.jsx)(s.h1,{id:"reference",children:"Reference"}),"\n",(0,n.jsx)(s.h2,{id:"props",children:"Props"}),"\n",(0,n.jsxs)(s.p,{children:["Inherits ",(0,n.jsx)(s.a,{href:"/docs/0.73/view#props",children:"View Props"}),"."]}),"\n",(0,n.jsx)(s.h3,{id:"progress",children:(0,n.jsx)(s.code,{children:"progress"})}),"\n",(0,n.jsx)(s.p,{children:"The progress value (between 0 and 1)."}),"\n",(0,n.jsxs)(s.table,{children:[(0,n.jsx)(s.thead,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.th,{children:"Type"}),(0,n.jsx)(s.th,{children:"Required"})]})}),(0,n.jsx)(s.tbody,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.td,{children:"number"}),(0,n.jsx)(s.td,{children:"No"})]})})]}),"\n",(0,n.jsx)(s.hr,{}),"\n",(0,n.jsx)(s.h3,{id:"progressimage",children:(0,n.jsx)(s.code,{children:"progressImage"})}),"\n",(0,n.jsx)(s.p,{children:"A stretchable image to display as the progress bar."}),"\n",(0,n.jsxs)(s.table,{children:[(0,n.jsx)(s.thead,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.th,{children:"Type"}),(0,n.jsx)(s.th,{children:"Required"})]})}),(0,n.jsx)(s.tbody,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.td,{children:"Image.propTypes.source"}),(0,n.jsx)(s.td,{children:"No"})]})})]}),"\n",(0,n.jsx)(s.hr,{}),"\n",(0,n.jsx)(s.h3,{id:"progresstintcolor",children:(0,n.jsx)(s.code,{children:"progressTintColor"})}),"\n",(0,n.jsx)(s.p,{children:"The tint color of the progress bar itself."}),"\n",(0,n.jsxs)(s.table,{children:[(0,n.jsx)(s.thead,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.th,{children:"Type"}),(0,n.jsx)(s.th,{children:"Required"})]})}),(0,n.jsx)(s.tbody,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.td,{children:"string"}),(0,n.jsx)(s.td,{children:"No"})]})})]}),"\n",(0,n.jsx)(s.hr,{}),"\n",(0,n.jsx)(s.h3,{id:"progressviewstyle",children:(0,n.jsx)(s.code,{children:"progressViewStyle"})}),"\n",(0,n.jsx)(s.p,{children:"The progress bar style."}),"\n",(0,n.jsxs)(s.table,{children:[(0,n.jsx)(s.thead,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.th,{children:"Type"}),(0,n.jsx)(s.th,{children:"Required"})]})}),(0,n.jsx)(s.tbody,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.td,{children:"enum('default', 'bar')"}),(0,n.jsx)(s.td,{children:"No"})]})})]}),"\n",(0,n.jsx)(s.hr,{}),"\n",(0,n.jsx)(s.h3,{id:"trackimage",children:(0,n.jsx)(s.code,{children:"trackImage"})}),"\n",(0,n.jsx)(s.p,{children:"A stretchable image to display behind the progress bar."}),"\n",(0,n.jsxs)(s.table,{children:[(0,n.jsx)(s.thead,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.th,{children:"Type"}),(0,n.jsx)(s.th,{children:"Required"})]})}),(0,n.jsx)(s.tbody,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.td,{children:"Image.propTypes.source"}),(0,n.jsx)(s.td,{children:"No"})]})})]}),"\n",(0,n.jsx)(s.hr,{}),"\n",(0,n.jsx)(s.h3,{id:"tracktintcolor",children:(0,n.jsx)(s.code,{children:"trackTintColor"})}),"\n",(0,n.jsx)(s.p,{children:"The tint color of the progress bar track."}),"\n",(0,n.jsxs)(s.table,{children:[(0,n.jsx)(s.thead,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.th,{children:"Type"}),(0,n.jsx)(s.th,{children:"Required"})]})}),(0,n.jsx)(s.tbody,{children:(0,n.jsxs)(s.tr,{children:[(0,n.jsx)(s.td,{children:"string"}),(0,n.jsx)(s.td,{children:"No"})]})})]})]})}function h(e={}){let{wrapper:s}={...(0,i.a)(),...e.components};return s?(0,n.jsx)(s,{...e,children:(0,n.jsx)(a,{...e})}):a(e)}},80980:function(e,s,r){r.d(s,{Z:()=>d,a:()=>o});var t=r(27378);let n={},i=t.createContext(n);function o(e){let s=t.useContext(i);return t.useMemo(function(){return"function"==typeof e?e(s):{...s,...e}},[s,e])}function d(e){let s;return s=e.disableParentContext?"function"==typeof e.components?e.components(n):e.components||n:o(e.components),t.createElement(i.Provider,{value:s},e.children)}},69344:function(e){e.exports=JSON.parse('{"id":"progressviewios","title":"\u{1F6A7} ProgressViewIOS","description":"Removed. Use one of the community packages instead.","source":"@site/versioned_docs/version-0.73/progressviewios.md","sourceDirName":".","slug":"/progressviewios","permalink":"/docs/0.73/progressviewios","draft":false,"unlisted":false,"editUrl":"[{\\"label\\":\\"Edit page for next release\\",\\"href\\":\\"https://github.com/facebook/react-native-website/edit/main/docs/progressviewios.md\\"},{\\"label\\":\\"Edit page for 0.73 release\\",\\"href\\":\\"https://github.com/facebook/react-native-website/edit/main/website/versioned_docs/version-0.73/progressviewios.md\\"}]","tags":[],"version":"0.73","lastUpdatedAt":1702040446000,"frontMatter":{"id":"progressviewios","title":"\u{1F6A7} ProgressViewIOS"}}')}}]);